Как использовать href = «javascript: window.open…» в Angular JS?

0

Я пытаюсь использовать тег в HTML, чтобы открыть новое окно модального браузера с URL-адресом, который извлекается через угловое значение, так:

<a href="javascript:OpenPopUpPage('{{listing.Linktest}}');">Test Link</a>

Остальная часть моей угловой разметки работает очень хорошо, но вышеупомянутый якорь не работает. В нескольких попытках, которые я сделал, я либо вообще не получаю значение (null), либо полученный URL-адрес помечен как "небезопасный".

Я попытался вызвать метод в моем контроллере, чтобы вернуть значение, но те же ошибки.

Неужели я ошибаюсь?

Примечание. OpenPopUpPage - это встроенная функция SharePoint, которую я использую, но я мог бы просто вызвать window.open или что-то еще. Но я думаю, что это немаловажно для этой проблемы.

UPDATE: Я создал jsfiddle (предупреждение, первый таймер) и попытался выполнить пару ответов здесь как демонстрацию, но я не могу заставить их работать правильно. Мой jsfiddle

  • 0
    Можете ли вы сделать скрипку и поделитесь ссылкой для проверки вашего кода?
  • 0
    Могу ли я предложить не использовать javascript: Это сделает вещи проще ... намного меньше лишних действий.

3 ответа

0
Лучший ответ

То, что у вас есть, не является нормальной ссылкой. Это больше <button>, хотя это может идти в любом случае.

Угловой способ обработки щелчка, чтобы открыть новое окно, будет следующим:

<button type="button" ng-click="$ctrl.click($event)">...</button>

и в вашем угловом коде:

function Controller/Copmponent/Directive/Whatever() {
    this.url = 'http://example.com';
    this.click = function () {
        open(this.url, this.target, this.options);
    };
}

Если ваша страница нуждается в поддержке отключенного JavaScript или если вы вообще не находились в угловой зоне, может быть разумным использовать элемент <a> при условии, что вы даете href действительный URL-адрес:

<a href="{{$ctrl.url}}" ng-click="$ctrl.click($ctrl.url, $event)">...</a>
  • 0
    Благодарю за ваш ответ. Я попытался использовать ваш ответ в этом jsfiddle. Вы видите, где я иду не так? jsfiddle.net/planetparker28/7z7uttnb/5
  • 0
    @JimParker, много мелочей .
Показать ещё 4 комментария
0

Я хотел бы добавить этот окончательный ответ, поскольку, в то время как другие предоставляют хорошие примеры для открытия всплывающих окон или новых окон, основная цель заключалась в том, чтобы открыть новое окно для местоположения, которое было передано из значения запроса углового /REST.

Ответ был двухчастным:

1) Используйте ng-click вместе с функцией/методом внутри вашего контроллера, чтобы обрабатывать открытие нового окна. Не пытайтесь использовать javascript непосредственно внутри. Спасибо всем, кто внес свой вклад в этот урок для меня. 2) Кроме того, при передаче значения функции, поступающей из вывода запроса контроллера, не включайте {{}} вокруг вашего пройденного значения, поскольку, по-видимому, это только для перераспределения данных, а не для передачи его.

Итак, вот получившийся код:

//HTML:
    <button type="button" ng-click="foo(myController.LinkValue)">Let Do This</button>

//Code within Controller:
$scope.foo = function(myURL) {
    open(myURL, 'popup', 'width=300,height=200');
        };
0
.controller('controllerName', ['$scope', '$window',
    function($scope, $window) {
        $scope.redirectToNewPage = function(){
            $window.open('https://www.google.com', '_blank');
        };
    }
]);
  • 1
    вызывать функцию по клику, <a href data-ng-click="redirectTonewPage()">
  • 0
    Здравствуйте, спасибо за ответ. Мне понадобилось немного времени, чтобы создать учетную запись скрипки и перенести в нее образец, который действительно работал. Попробуйте это, пожалуйста: jsfiddle.net/planetparker28/7z7uttnb/…
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню