Question

我想在需要时加载我的部分内容？例如，我有一个由6个缩略图组成的部分，当点击其中一个加载我的部分时，请告诉我？

Answer 1

您需要使用路由来执行此操作。这是tutorial，但基本设置如下：

HTML - 这将有几个<a>锚标记，每个标记包含各自的路由，如下所示：

  <ul class="phones">
    <li ng-repeat="phone in phones | filter:query | orderBy:orderProp" class="thumbnail">
      <a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>
      <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
      <p>{{phone.snippet}}</p>
    </li>
  </ul>

然后，您需要确保将应用设置为使用ngRoute：

var phonecatApp = angular.module('phonecatApp', [
  'ngRoute',
  'phonecatControllers'
]);

然后在配置中设置routeProvider：

phonecatApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/phones', {
        templateUrl: 'partials/phone-list.html',
        controller: 'PhoneListCtrl'
      }).
      when('/phones/:phoneId', {
        templateUrl: 'partials/phone-detail.html',
        controller: 'PhoneDetailCtrl'
      }).
      otherwise({
        redirectTo: '/phones'
      });
  }]);

这会指示ng-repeat中的每个块使用templateUrl中定义的部分。

当然，您还必须在控制器中定义行为，但这应该可以让您开始基本路由。

使用AngularJS加载部分

1 个答案: