jquery - AngularJS如何延迟绑定(bind)元素

Question

页面上有一些我想设置为延迟的“状态”元素，意思是在多个文件上传完成后。当然，使用 jQuery 选择器这很容易，但是我如何以“Angular 方式”做到这一点？

这里有一个技巧:上传的文件数量可以是 1 到 X，因此这些“状态”范围(上传完成后用文本填充)每个都需要引用数组中的一个项目。

我尝试了一些方法，但无法使其发挥作用。

我的问题有意义吗？

Answer 1

您仍然可以在 Angular 中使用 jQuery 选择器，唯一真正的规则是除了自定义指令之外，您不要在任何地方进行 DOM 操作。目前还不完全清楚你想要做什么，但如果你需要直接操作 DOM 并且无法使用 ng-class 或 ng-show/hide 或其他一些内置指令来实现它，那么你可能需要一个自定义指令。

像这样写

angular.module("myModule", []).directive("myAwesomeDirective", [function(){
    return {
       restrict:'E', //could be E = element, C = class, A = attribute
       scope: {incomingData:"="},
       link:function(scope,iElem,iAttrs) {
          //this function called for each instance of the directive
          //do your DOM manipulation here
           scope.$watch(function() {return scope.incomingData}, function(newVal,oldVal) {
              console.log(newVal);
          }, true)
       }
    }
}]).controller("MyCtrl", ["$scope", function($scope) {
    $scope.someArray = [1,2,3,4];
    $scope.addElement = function() {
        $scope.someArray.push(Math.floor(10*Math.random()));
    }
}]);

用法如

<div ng-app="myModule" ng-controller="MyCtrl">
    <button ng-click="addElement()">Add random</button>
    test
    {{someArray}}
    <my-awesome-directive incoming-data="someArray"></my-awesome-directive>
</div>

在此处查看更多信息:http://docs.angularjs.org/guide/directive或http://www.egghead.io

如果这没有帮助，请尝试显示一些代码，或者只是详细解释一下您已尝试过的内容以及未按预期工作的内容。

编辑

更新为包含一些用于绑定(bind)到传入参数的内容，将尝试为其设置一个 fiddle 。

http://jsfiddle.net/uBaSa/1/