角度ng顯示不能從控制器工作

我想在視頻結束後顯示div。視頻結束後會顯示警報，但div仍不可見。我在做什麼錯誤。感謝您提前給予幫助。角度ng顯示不能從控制器工作

@section scripts 
{ 
    <script type="text/javascript" src="~/App/Controllers/TestController.js"></script> 
} 
<div ng-controller="TestController as ctrl" class="md-content" ng-cloak> 
    <h1>Test</h1> 

    <video id="myVideo" controls autoplay> 
     <source src="~/Videos/Test1.mp4"> 
    </video> 

    <div id="test" ng-show="ui.showTest"> 
     <h1>Test</h1> 
     Added this as a test to see if your controller is linked to the view 
     <p>{{ui.shouldSeeThis}}</p> 
    </div> 
</div>

這是控制器

angular.module('MyApp', ['ngMaterial', 'ngMessages']) 
.controller('TestController', function ($scope, $http, $filter, $mdDialog) { 


var vid; 

function initializePlayer() { 

    vid = document.getElementById("myVideo"); 
    vid.addEventListener('ended', videoFinish, false); 
} 

window.onload = initializePlayer; 

$scope.ui = { 
    showTest: false, 
    //I've added this to see if your controller is linked to the view 
    shouldSeeThis: "Hello World" 
}; 
function videoFinish() { 
    $scope.ui.showTest = true; 
    alert("VideoFinish"); 
}

}）;

來源

2016-10-19 user6934713

沒有足夠的信息在這裏肯定知道是什麼問題，但你*可能是「總是在角度綁定中使用點」規則的受害者。你已經在'ng-show'中綁定了一個原語，並且由於原型繼承，這個原語很容易被無法訪問。你應該總是綁定對象屬性，而不是基元。請參閱http://stackoverflow.com/questions/14049480/what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs – Claies

您應該提供完整的代碼。 – Karim

你確實檢查了視頻後showTest的價值。 $ scope不是唯一的...您可以在另一個$ scope中遇到問題，因爲您可以編寫{{showTest}}或安裝一個extencion如何使用ng-inspector。一個簡單的解決方法是使用一個對象 – Pablote

看起來您需要強制摘要以反映視圖中的範圍更改。發生這種情況是因爲您正在使用javascript事件更改範圍值。

在您的控制器添加$timeout：

.controller('TestController', function ($scope, $http, $filter, $mdDialog, $timeout)

在你的函數包裹的代碼與它：

function videoFinish() { 
    $timeout(function() { 
     $scope.ui.showTest = true; 
     alert("VideoFinish"); 
    }); 
}

來源

2016-10-19 16:33:13 Akis

謝謝。這是工作 – user6934713

正如評論指出，這是綁定到一個對象屬性的最佳實踐。請嘗試以下操作：

<div id="test" ng-show="ui.showTest"> 
    <h1>Test</h1> 
    <!-- Added this as a test to see if your controller is linked to the view--> 
    <p>{{ui.shouldSeeThis}}</p> 
</div>

$scope.ui = { 
    showTest: false, 
    //I've added this to see if your controller is linked to the view 
    shouldSeeThis: "Hello World" 
}; 
function videoFinish() 
{ 
    $scope.ui.showTest = true; 
    alert("VideoFinish"); 
}

正如註釋狀態，如果粘貼上面的代碼中，你應該看到「Hello World」的<p>元素裏我增加額外的屬性的對象，。我把它放在答案中，因爲你的問題沒有提供所有相關的代碼。

來源

2016-10-19 15:24:50

謝謝。我根據你的建議修改了我的代碼，但我仍然沒有看到我的div – user6934713

角度ng顯示不能從控制器工作

回答

相關問題