Question

我确实在某种程度上挣扎，如上所述我需要将一个链接放入一个var in js中，这样它只有在点击这个项目时才会打开。

Js部分如下：

var items = [{
    'icon': 'new',
    'name': 'test',
    'date': 'today',
    'user': {
        'name': 'test',
        'color': '#07D5E5'
    }
}];

部分Html输出如下：

    <pager total-items="totalItems" items-per-page="itemsPerPage" 
     ng-model="currentPage" max-size="maxSize" ng change="pageChanged()"></pager>
      <p ng-if="itemsPerPage * currentPage < totalItems">
        Showing {{ itemsPerPage * currentPage - itemsPerPage + 1 }} - 
     {{ itemsPerPage * currentPage }} of {{ totalItems }} total items
      </p>
      <p ng-if="itemsPerPage * currentPage >= totalItems">
        Showing {{ itemsPerPage * currentPage - itemsPerPage + 1 }} -
      {{ totalItems }} of {{ totalItems }} total items
      </p>

如何在此Js中设置一个链接，当有人点击名称时会打开该链接：test？我不明白

Answer 1

我建议更新items变量的结构，以包含url属性和target属性：

var items = [{
    'icon': 'new',
    'name': 'test',
    'url': 'http://some.actual.url/',
    'target': '_blank',
    'date': 'today',
    'user': {
        'name': 'test',
        'color': '#07D5E5'
    }
}];

然后在你的角度：

<span class="grid-title">
    <a href="{{ item.url }}" target="{{ item.target }}">{{ item.name }}</a>
</span>

Answer 2

以下是一个使用各种ng属性并包含您的项目以使用它们的示例：

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
        $scope.itemsPerPage = 10;
        $scope.currentPage = 1;
        $scope.totalItems = 100;

        var items = [{
            'icon': 'new',
                'name': 'test',
                'date': 'today',
                'user': {
                'name': 'test',
                    'color': '#07D5E5'
            }
        }];

        $scope.otherItems = [{
            'icon': 'old',
                'name': 'other',
                'date': 'yesterday',
                'user': {
                'name': 'other',
                    'color': '#02D0E0'
            }
        }];

        $scope.redirect = function(name) {
            if (name == 'test') {
                window.location.href = 'http://stackoverflow.com/questions/30948701/set-a-link-into-a-js-var';
            }
        };

        showItems = [];

        function init() {
            for (var i = 0; i < 100; i++) {
                $scope.otherItems.push(i == 5 ? items[0] : $scope.otherItems[0]);
            }
        }
        init();

    });
</script>
<div ng-app="myApp" 
     ng-controller="myCtrl">
    <pager total-items="totalItems" 
           items-per-page="itemsPerPage" 
           ng-model="currentPage" 
           max-size="maxSize" 
           ng-change="pageChanged()"></pager>
    <p ng-if="itemsPerPage * currentPage < totalItems">Showing {{ itemsPerPage * currentPage - itemsPerPage + 1 }} - {{ itemsPerPage * currentPage }} of {{ totalItems }} total items</p>
    <p ng-if="itemsPerPage * currentPage >= totalItems">Showing {{ itemsPerPage * currentPage - itemsPerPage + 1 }} - {{ totalItems }} of {{ totalItems }} total items</p>
    <p ng-repeat="i in otherItems track by $index" 
       ng-if="$index < itemsPerPage * currentPage && $index > itemsPerPage * (currentPage-1)" 
       ng-click="redirect(i['name'])" 
       ng-style="{'text-decoration':(i['name'] == 'test' ? 'underline' : '')}">{{i['name']}}</p>
</div>
</div>

将链接设置为Js var？

2 个答案: