Question

嗨，我想点击一个链接打开一个新页面而不是在同一页面打开它。

我是棱角分明的新手，无法实现。

我需要帮助。

这是我到目前为止所尝试过的。

HTML：

<ul ng-controller="ListController">
    <li ng-repeat="item in items" ng-controller="ItemController">
        <div ng-click="open(item)">{{item.content}}</div>        
    </li>
    <hr>
    <ng-switch on="anyItemOpen()">
     <div ng-switch-when="true">
         <div ng-controller="ItemController">
             {{opened.name}}: overlay: tweet, share, pin
         </div>  
         <a ng-click="close()">close</a>         
     </div>
    </ng-switch>   
</ul>

JS：

function ItemController($scope) {
}

function ListController($scope) {
    $scope.items = [
        {name: 'item1', content: 'content1'},
        {name: 'item2', content: 'content2'},
        {name: 'item3', content: 'content3'}
    ];

    $scope.open = function(item){
        if ($scope.isOpen(item)){
            $scope.opened = undefined;
        } else {
            $scope.opened = item;
        }        
    };

    $scope.isOpen = function(item){
        return $scope.opened === item;
    };

    $scope.anyItemOpen = function() {
        return $scope.opened !== undefined;
    };

    $scope.close = function() {
        $scope.opened = undefined;
    };
}

这是我的Working Demo

Answer 1

将target =“_ blank”添加到具有href属性的所有标记的指令。这意味着他们将在一个新窗口中打开。请记住，Angular中的指令用于任何dom操作/行为。现场演示（点击）。

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");
    }
  };
});

查看此帖子here

使用Angular JS打开一个新页面

1 个答案: