gpt4 book ai didi

javascript - 这个 AngularJS 指令有什么问题?

转载 作者:行者123 更新时间:2023-11-30 16:27:18 25 4
gpt4 key购买 nike

我正在尝试为 AngularJS 编写一个 imgix 指令。这是我的代码:

MetronicApp
.directive('imgix', function() {
return {
replace: true,
scope: {
url: '='
},
restrict: "A",
template: "<img class='thumbnail inline' width={{w}} height={{h}} src='https://mysite.imgix.net/{{url}}?h={{h}}&w={{w}}&fit=crop'>",
link: function(scope, elm, attrs) {
function ctrl(value, mode) {
// check inputs
if ((value === null) || (value === undefined) || (value === '')) {
// let's do nothing if the value comes in empty, null or undefined
return;
}

scope.h = attrs.height || 50;
scope.w = attrs.width || 50;
scope.url = value;


}

// by default the values will come in as undefined so we need to setup a
// watch to notify us when the value changes
scope.$watch(attrs.url, function(value) {
ctrl(value, 'url');
});
}
};
});

在 html 中,我有 2 张图片:

 <img imgix data-height="200" data-width="200" url="theme.options.homepageBackground" />

<img imgix data-height="200" data-width="200" url="theme.options.menuBackground" />

但是结果就像图片:

enter image description here

我不明白哪里出了问题。有关于范围的东西吗?

最佳答案

您的指令范围绑定(bind)到父范围。请改用子作用域或独立作用域。

MetronicApp.directive('imgix', function() {
返回 {
范围: {
网址:'='
}

关于javascript - 这个 AngularJS 指令有什么问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33912253/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com