programing

Angular를 사용하여 새 창에서 링크 열기JS

codeshow 2023. 3. 28. 22:20
반응형

Angular를 사용하여 새 창에서 링크 열기JS

Angular에게 말할 방법은 없을까?사용자가 링크를 클릭할 때 새 창에서 링크를 열도록 JS를 선택하십시오.

jQuery를 사용하면 다음과 같이 할 수 있습니다.

jQuery("a.openInNewWindow").click( function() {
    window.open(this.href);
    return false;
})

AngularJS와 동등한 기능이 있습니까?

여기 다음 지침이 있습니다.target="_blank"모두에게<a>꼬리표를 달다href기여하다.그것은 모두 새로운 창문으로 열린다는 것을 의미한다.지시문은 Angular에서 돔 조작/동작에 사용됩니다.라이브 데모(클릭).

app.directive('href', function() {
  return {
    compile: function(element) {
      element.attr('target', '_blank');
    }
  };
});

여기 같은 컨셉으로 침습성이 낮아지고(모든 링크에 영향을 주지 않음) 적응성이 향상되었습니다.부모 요소에서 사용하여 모든 자식 링크에 영향을 줄 수 있습니다.라이브 데모(클릭).

app.directive('targetBlank', function() {
  return {
    compile: function(element) {
      var elems = (element.prop("tagName") === 'A') ? element : element.find('a');
      elems.attr("target", "_blank");
    }
  };
});

오래된 답변

그냥 이렇게 해서"target="_blank"<a>태그. 다음 두 가지 방법이 있습니다.

<a href="//facebook.com" target="_blank">Facebook</a>
<button ng-click="foo()">Facebook</button>

JavaScript:

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope, $window) {
  $scope.foo = function() {
    $window.open('//facebook.com');
  };
});

라이브 데모는 이쪽(클릭).

여기 의 자료가 있습니다.$window: http://docs.angularjs.org/api/ng.$window

그냥 사용하면 된다.window단, 의존성 주입을 사용하는 것이 좋습니다.각도의$window테스트용입니다.

저는 좋아요.주입$window컨트롤러에 서비스를 제공합니다.

$window.open("somepath/", "_blank")

다음을 사용할 수 있습니다.

$window.open(url, windowName, attributes);

이것은 당신의 버튼의 코드입니다.

<a href="AddNewUserAdmin" 
   class="btn btn-info " 
   ng-click="showaddnewuserpage()">
  <span class="glyphicon glyphicon-plus-sign"></span> Add User</a>

이 기능을 추가합니다.

 var app = angular.module('userAPP', []);

app.controller('useraddcontroller', function ($scope, $http, $window) {

$scope.showaddnewuserpage = function () {

    $window.location.href = ('/AddNewUserAdmin');
}

});

@m59 ng-bind-html에 대해 디렉티브가 기능합니다.기다리시면 됩니다.$viewContentLoaded끝내다

app.directive('targetBlank', function($timeout) {
  return function($scope, element) {
    $scope.initializeTarget = function() {
      return $scope.$on('$viewContentLoaded', $timeout(function() {
        var elems;
        elems = element.prop('tagName') === 'A' ? element : element.find('a');
        elems.attr('target', '_blank');
      }));
    };
    return $scope.initializeTarget();

  };
});

저는 이 문제에 대한 해결책을 찾는 모든 사람에게 매우 도움이 될 수 있는 작은 요지를 썼습니다.외부 링크

그것이 하는 일은 바로target="_blank"현재 도메인과 다른 도메인에 링크되는 앵커 요소에 대한 속성입니다.원하는 대로 패치할 수 있습니다.

많은 링크를 거쳤지만 이 답변이 많은 도움이 되었습니다.

$scope.redirectPage = function (data) { $window.open(data, "popup", "width=1000,height=700,left=300,top=200"); };

** 데이터는 당신이 누르고 있는 절대 URL 입니다.

언급URL : https://stackoverflow.com/questions/20099784/open-links-in-new-window-using-angularjs

반응형