Fatal编程技术网
  • javascript/
  • Javascript 将变量从控制器传递到指令'；s隔离作用域，而不将其添加到父级'；s范围

Javascript 将变量从控制器传递到指令'；s隔离作用域，而不将其添加到父级'；s范围

javascript angularjs

Javascript 将变量从控制器传递到指令'；s隔离作用域，而不将其添加到父级'；s范围,javascript,angularjs,angularjs-directive,angularjs-scope,Javascript,Angularjs,Angularjs Directive,Angularjs Scope,抱歉，如果标题不是最准确的。。 那么，我想做什么，以及背后的原因是什么。我有一个非常庞大的条目列表，最多400个条目，我从ajax请求中获得这个列表，现在如果第一个条目具有运行的属性，我想从列表中提取它（通过使用splice（）），并将它传递给一个指令，该指令可以在一个独立的范围内处理它。为什么？因为正在运行的条目上会有一个计时器，它会使用$timeout每秒向其中一个属性添加+1 现在我希望它是孤立的，因为这我不希望过滤器和列表上的所有不运行的条目被调用每一秒，只是因为一些东西（特别是计时器）

抱歉，如果标题不是最准确的。。 那么，我想做什么，以及背后的原因是什么。我有一个非常庞大的条目列表，最多400个条目，我从ajax请求中获得这个列表，现在如果第一个条目具有运行的
属性，我想从列表中提取它（通过使用
splice（）
），并将它传递给一个指令，该指令可以在一个独立的范围内处理它。为什么？因为正在运行的条目上会有一个计时器，它会使用
$timeout
每秒向其中一个属性添加+1

现在我希望它是孤立的，因为这我不希望过滤器和列表上的所有不运行的条目被调用每一秒，只是因为一些东西（特别是计时器）在运行的条目上改变

现在，当我按下save或其他按钮时，我想将正在运行的条目放回条目中，只使用
running:false
Now

我知道如何从父对象继承对象，并在指令上从它创建一个独立的作用域-

通过这种方式传递它似乎并不理想，但我被告知这很好，没有什么真正违背最佳实践的

现在问题来了


  • 有没有办法在不将指令添加到作用域的情况下传递“running”指令，因为一旦它被复制，它在那里几乎是无用的

      

    • 我是否应该寻找一种在不将其添加到范围的情况下传递它的方法
      • 

    • 或者我应该在它被复制后删除它
      • 

    • 或者我应该离开它，因为它不重要
      • 

    • 

  • 如果使用ajax设置
    条目
    ，则不可能复制正在运行的条目，因为它尚未设置-

      

    • 指令中是否应该有
      $watch
      • 

    • 或者我应该使用广播/打开？像这样
      • 

    • 还是我完全做错了
      • 

    • 

    谢谢
     如果你想传递一个完整的文本对象，你必须使用“=”，但是如果你想使用@，你必须使用$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>

    

    
安古拉斯普朗克
var app=angular.module（'plunker'，[]）；
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.obj={姓名：“约翰”，姓氏：“多伊”}；
$scope.title={name:'abc'}；
});
app.directive（'myDirective'，function（）{
返回{
限制：'E'，
模板：“{{obj.name}}{{title}}”，
替换：正确，
作用域：{title:'@'，obj:'='}，
链接：函数（范围、元素、属性）{
属性$observe（'title'，函数（值）{
警报（范围$eval（值）.name）；
})
}
}
})

    将您的指令更改为scope: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>

    

    
独立作用域中指令上的“正在运行”项
计时器：{{Timer}}
    
{{running | json}}
    

    

    如果要将变量从控制器传递到指令，则必须在作用域内设置属性并使用属性，如作用域：{entry:'@items'}有关详细说明，请参见@不适用于对象，请看，我仍然需要将正在运行的条目添加到作用域中，才能将其传递到目录。它不是真的，请在htmlhow中使用下面的代码。它不是真的吗，在您的示例中，您只传递一个带名称的字符串。我需要的远不止名称，条目至少还有5个其他属性，这就是为什么我想传递整个entry对象的原因。我以为你只想传递一个属性来获得完整的文本。请使用=属性=将设置双向绑定，不是吗？这对我来说也不好，我不希望指令的作用域影响父作用域。原因在我问题的第二段中。然后您必须在指令中使用scope.eval。另一种方法是观察上面编辑的属性更改