4

setTimeout 関数内でスコープを編集して、ng-show をトリガーしようとしました。setTimeout は、データベース クエリ コールバックのプレースホルダーです。

index.html:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>

<script src="script.js"></script>


<div ng-controller="c1">

    <div ng-show="{{show}}"  >

        test it

    </div>

</div>

script.js:

var amTestNgShow = angular.module('amTestNgShow',[]);

amTestNgShow.controller('c1', ['$scope', function($scope) {

    // this works: $scope.show = true;

    setTimeout(function(){

        $scope.show = true; // works not

        // does not help: $scope.$apply();

    }, 1000)

}]);

これはsetTimeout内でどのように実行できますか? どうも！

http://plnkr.co/edit/RPS2vZAlVfhliQKteSSK

更新: 上記で説明したように、setTimeout は問題ではなく、再現可能なスタック オーバーフローの質問を生成するためにのみ使用されます。私のプロジェクトでは、サービスを構築しました：

amProject1.service('asBasic', ['$http', '$q', function($http, $q){

    var asBasic = {};

    asBasic.docName = '';

    var doc = {};

    asBasic.get = function(id){

        var deferred = $q.defer();

        $http({method:'GET', url: '/' + this.docName + '/' + id})
            .success(function(data, status, headers, config){

                if(data === undefined){

                    deferred.reject("The requested " + asBasic.docName + " was not found.")

                }

                doc = data;
                deferred.resolve(doc);

            })
            .error(function(data, status, headers, config){

                deferred.reject(status);

            })

       return deferred.promise;

    }


    return asBasic;

}]);

のように使う

amProject1.controller('acDoc1', ['$scope', '$routeParams', 'asBasic', function($scope, $routeParams, asBasic){

    asBasic.docName = 'doc1';

    // this works: $scope.show = true;

    asBasic.get($routeParams._id)
        .then(function(data){

            $scope.doc1 = data;

            $scope.show = true; // works not

            // does not help: $scope.$apply();

            // ...

        }
        // ...
4

4 に答える 4

2

テンプレートで {{show}} にバインドしていることに気付きました。中括弧は AngularJS 属性内にあるため、削除する必要があります。

于 2014-04-16T09:39:23.977 に答える
2

これは、setTimeout が$scopeプロセスの外部にあるためです。代わりに注入して使用$timeoutします。

http://docs.angularjs.org/api/ng/service/$timeout

例えば：

amTestNgShow.controller('c1', ['$scope', '$timeout', function($scope, $timeout) {
    $timeout(function(){
        $scope.show = true;
    }, 1000);
}]);

代わりに を使用したい場合は$scope.apply、単に使い方が間違っていたと思います。スコープの編集後に呼び出す$scope.apply()のではなく、適用関数内に配置します。

$scope.apply(function(){
    $scope.show = true;
});
于 2014-04-16T09:12:10.383 に答える
1

私の投稿の最近のレビュー: mrida は正しかった (thx)、中かっこは削除する必要があります ...

<div ng-controller="c1">

    <div ng-show="show">

        test it

    </div>

</div>

ng-styleで解決することも可能です。

html:

...

<div ng-controller="c1">

    <div ng-style="{'visibility': show}">

        test it

    </div>

</div>

...

コントローラ：

...

setTimeout(function(){

    $scope.show = "visible"; // or $scope.show = "hidden"

    $scope.$apply();

}, 1000)

...
于 2014-04-17T07:49:35.723 に答える
-1

$timeoutの代わりにsetTimeout、の'show'代わりに使用'{{show}}'

<div ng-show="show">
    test it
</div>
于 2014-04-16T09:39:21.937 に答える