国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

angular.js - angularjs中視圖中的值更新問題
PHP中文網(wǎng)
PHP中文網(wǎng) 2017-05-16 13:18:53
0
1
847

SolarTerms.controller('FooterCtrl', ['$state', '$rootScope', '$scope', function ($state, $rootScope, $scope) {

$scope.imgsrc = {
    "imda1":"img/icon1.png",
    "imda2":"img/icon2.png",
    "imda3":"img/icon3.png",
    "imda4":"img/icon4.png",
    "imda5":"img/icon5.png"
}

}])

SolarTerms.directive("tabImg",function () {

    return {
        restrict:'A',
        scope:false,
        link:function (scope,ele,attr,ctrl) {
            ele.bind('click',function (event) {
                var index = $(this).index();
                scope.imgsrc = {
                    "imda1":"img/icon1.png",
                    "imda2":"img/icon2.png",
                    "imda3":"img/icon3.png",
                    "imda4":"img/icon4.png",
                    "imda5":"img/icon5.png"
                };
                scope.imgsrc['imda'+(index+1)] = 'img/icon'+(index+1)+'1.png';
                //scope.$apply(scope.imgsrc['imda'+(index+1)] = 'img/icon'+(index+1)+'1.png')
            })
        }
    }
})

<p tab-img class="I_AF_p" ng-click="goto('index')"><img ng-src="{{imgsrc.imda1}}" alt=""><span>首頁</span></p>
<p tab-img class="I_AF_p" ng-click="goto('ye')"><img ng-src="{{imgsrc.imda2}}" alt=""><span>余額</span></p>
<p tab-img class="I_AF_p" ng-click="goto('js')"><img ng-src="{{imgsrc.imda3}}" alt=""><span>計算</span></p>
<p tab-img class="I_AF_p" ng-click="goto('ck')"><img ng-src="{{imgsrc.imda4}}" alt=""><span>查看</span></p>
<p tab-img class="I_AF_p" ng-click="goto('wd')"><img ng-src="{{imgsrc.imda5}}" alt=""><span>文檔</span></p>

點擊相應(yīng)的p之后獲取索引,然后更改$scope.imgsrc中相應(yīng)的值,控制臺能正確輸出圖片地址,但是視圖中ng-src中的值為什么需要點擊兩次才能改變,我只是想更改ng-src中的圖片地址,剛開始學(xué)angularjs,誰幫我解釋下,謝謝。

PHP中文網(wǎng)
PHP中文網(wǎng)

認證高級PHP講師

全部回復(fù)(1)
洪濤

需要手動觸發(fā)angular的渲染機制

 link:function (scope,ele,attr,ctrl, $timeout) {
            ele.bind('click',function (event) {
                var index = $(this).index();
                scope.imgsrc = {
                    "imda1":"img/icon1.png",
                    "imda2":"img/icon2.png",
                    "imda3":"img/icon3.png",
                    "imda4":"img/icon4.png",
                    "imda5":"img/icon5.png"
                };
                
                $timeout(function() {
                    scope.imgsrc['imda'+(index+1)] = 'img/icon'+(index+1)+'1.png';
                    //scope.$apply(scope.imgsrc['imda'+(index+1)] = 'img/icon'+(index+1)+'1.png')
                })
                
            })
        }
最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板