2

遅延を設定したいページにいくつかの「ステータス」要素を配置します。つまり、多数のファイルのアップロードが完了した後です。もちろん、これは jQuery セレクターを使用すると非常に簡単ですが、「Angular の方法」でこれを行うにはどうすればよいですか?

ここに秘訣があります: アップロードするファイルの数は 1 から X になる可能性があるため、これらの「ステータス」スパン (アップロードの完了後にテキストで埋められる) は、それぞれ配列内の項目を参照する必要があります。

私はいくつかのことを試しましたが、うまくいきません。

私の質問は理にかなっていますか?

4

2 に答える 2

3

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

これで問題が解決しない場合は、いくつかのコードを表示してみるか、試したことと期待どおりに機能していないことについて詳しく説明してください。

編集

受信パラメーターにバインドするためのいくつかのものを含めるように更新され、そのためのフィドルをセットアップしようとします。

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

于 2013-08-31T01:58:05.437 に答える