Javascript 如何在Angularjs中禁用ng show from指令

我正在使用一个指令来确定图像何时加载。在我看来，我有一个带有加载微调器的

span

，它将通过

ng show

显示。默认值为TRUE

<ion-spinner icon="android" ng-show="showSpinner"></ion-spinner>
<img ng-src="{{imageSrc}}" imageonload>

---

考虑到这一点，您在定义指令时没有指定

scope

属性，这意味着没有为指令创建任何作用域，并且指令使用其父级的作用域，因此您可以只执行以下操作：

element.bind('load', function() {
    scope.showSpinner = false;
});

此外，还应使用，因为您正在处理超出Angular JS生命周期的DOM事件：

element.bind('load', function() {
    scope.$apply(function () {
        scope.showSpinner = false;
    });
});

---

但是它应该经过测试。

您可以尝试使用$broadcast和$on将指令中的信息发送给控制器

在指令中：

.directive('imageonload', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            element.bind('load', function() {
                /* HOW TO DISABLE showSpinner */
            });
            element.bind('error', function(){
                alert('error.');
            });
        }
    };
})

scope.$broadcast('stopSpinner');

在控制器中：

$scope.$on('stopSpinner',function() {scope.showSpinner = false});

您可能需要使用rootscope而不是scope

var-app=angular.module（'MyApp'，[]）；
app.controller（'AppCtrl'，函数（$scope）{
$scope.showSpinner=true；
});
app.directive（'imageonload'，函数（$timeout）{
返回{
限制：“A”，
范围：{
showSpinner:“=”
},
链接：函数（范围、元素、属性）{
//模拟加载图像的延迟，实际上这一行必须删除
$timeout（function（）{scope.showSpinner=false；}，1000）；
元素绑定（'load'，function（））{
/*如何禁用showSpinner*/
scope.showSpinner=false；
});
元素绑定（'error'，function（））{
警报（“错误”）；
});
}
};
});

加载。。。
您是否试图从指令内部控制指令外部的组件？@Yasser控制组件的确切含义是什么？

？您可以在加载回调中发出事件，然后在父控制器中处理此事件（您已声明showSpinner变量）在你的箱子里展示/隐藏。@vahidnajafi酷：）非常感谢。