相关疑难解决方法(0)

在指令中使用ng-transclude ng-repeat

我想在内容更改时创建一个包含自定义行为的列表.我尝试为此创建一个指令但是我对如何将ng-transclude与ng-repeat指令结合起来感到有点迷茫.有人能让我走上正轨吗?

HTML:

<div ng-app="myApp">
  <div ng-controller="ctrl">
    <mylist items="myItem in items">
       <span class="etc">{{myItem}}</span>
    </mylist>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

使用Javascript:

angular.module('myApp', [])    

.controller('ctrl', function ($scope) {
  $scope.items = ['one', 'two', 'three'];
})    

.directive('mylist', function () {
  return {
    restrict:'E',
    transclude: 'element',
    replace: true,
    scope: true,
    template: [
      '<ul>',
        '<li ng-repeat="WhatGoesHere in items" ng-transclude></li>',
      '</ul>'
    ].join(''),
    link: function (scope, element, attr) {
      var parts = attr.items.split(' in ');
      var itemPart = parts[0];
      var itemsPart = parts[1];
      scope.$watch(itemsPart, function (value) {
        scope.items = value; 
      });      
    } …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs

45
推荐指数
4
解决办法
3万
查看次数

标签 统计

angularjs ×1

javascript ×1