0

对不起,如果标题不是最准确的。那么我正在尝试做什么以及我背后的原因是什么。我有一个非常大的条目列表,最多 400 个项目,我从 ajax 请求中获取此列表,现在如果第一个项目具有属性running,我想从列表中提取它(通过使用splice())并将其传递给指令,它可以在一个孤立的范围内处理它。为什么?因为正在运行的条目上会有一个计时器,它每秒都会为它的一个属性添加 +1 $timeout

现在我希望它被隔离,因为这个Angular.js过滤器和作用域上的函数每秒都在变化) 在运行条目上更改。

现在,当我按保存或其他东西时,我想将正在运行的条目放回条目中,只有running: false现在。

我有点知道如何从父对象继承对象并在指令上从中创建一个隔离范围 - http://plnkr.co/edit/zq3urVh5t6N12T5ZrViO?p=preview

以这种方式将其传递到那里似乎并不理想,但有人告诉我这很好,并没有真正违反最佳实践。

现在问题/问题来了

  1. 有没有办法在不将其添加到范围的情况下传递“运行”指令,因为一旦它被复制它就几乎没用了
    • 我应该寻找一种在不将其添加到范围的情况下传递它的方法吗?
    • 还是我应该在复制后删除它?
    • 还是我应该离开它,因为它没关系?
  2. 如果ENTRIES使用 ajax 设置,则无法复制正在运行的,因为它尚未设置 - http://plnkr.co/edit/vH3hKbkTkTvcHqykIXDt?p=preview

谢谢!

4

2 回答 2

0

如果你想传递完整的文字对象,你必须使用 '=' 但是如果你想使用 @ 那么你必须使用 $eval 看看工作的小例子

<!doctype html>
<html ng-app="plunker" >
<head>
  <meta charset="utf-8">
  <title>AngularJS Plunker</title>

  <link rel="stylesheet" href="style.css">
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
  <script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
    <input ng-model="obj.name">

    <my-directive obj="obj" title="{{title}}">

      </my-directive>
    <script type="text/javascript">
        var app = angular.module('plunker', []);

        app.controller('MainCtrl', function ($scope) {
            $scope.obj = { name: "John", surname: "Doe" };
            $scope.title = { name: 'abc' };
        });


         app.directive('myDirective', function () {
        return {
            restrict: 'E',
            template: "<div><span>{{obj.name}}<span><span>{{title}}<span></div>",
            replace: true,
            scope: { title: '@', obj: '=' },
            link: function (scope, element, attrs) {
                attrs.$observe('title', function (value) {
                    alert(scope.$eval(value).name);
                })


            }
        }
    })
    </script>
</body>
</html>
于 2013-04-13T09:53:17.220 回答
0

将您的指令更改为具有范围:true - 然后将其隔离但继承父级

app.directive('myDirective', function($timeout) {
    return {
    restrict: 'E',
    scope: true,
        link: function(scope, element, attrs) {
            scope.timer = 0;
            $timeout(function tick() {
                scope.timer = scope.timer+1;
                $timeout(tick, 1000);
            });      
        }
    }
})

然后在您的指令中使用它,就好像它在父范围内一样!

<my-directive>
  <h4>"running" entry on directive in isolated scope</h4>
  <p>Timer: {{timer}}</p>
  {{ running | json }}<br/>
  <input type="text" ng-model="running.name" />
</my-directive>

http://plnkr.co/edit/f5AzfjoEmRT9P1Dw8REj?p=preview

于 2013-09-23T14:45:57.427 回答