هل يمكنك استخدام تعبير داخل NG-MODEL؟
https://stackoverflow.com//questions/23022112
-
21-12-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russianسؤال
أريد استخدام تعبير داخل توجيه NG-MODEL هل هناك طريقة لإنجاز هذا الربط؟هل يمكن القيام بذلك باستخدام شيء مثل الترجمة؟هنا هو الترميز الخاص بي
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body ng-controller="AppCtrl">
<div></div>
<range min="0" max="100" model="width"></range>
</body>
</html>
<script src="Scripts/angular.min.js"></script>
<script>
var app = angular.module("pager", []);
app.run(function($rootScope){
console.log($rootScope);
});
angular.element(document).ready(function(){
angular.bootstrap(document.querySelector("html"), ["pager"]);
})
app.directive("range", function ($compile) {
return {
restrict: "E",
replace: true,
scope:{
min:"@",
max:"@",
model:"@"
},
template: "<input type='range' ng-model='{{model}}' value='0' min='{{min}}' max='{{max}}'/>",
}
})
</script>
ng-model='{{model}}' يعطيك خطأً، هل هناك طريقة لجعله يقرأ سمة النموذج من التوجيه؟هل من الممكن ربطه بهذه الطريقة أم لا بد لي من استخدام $compile لإنجاز ذلك.أريد أن تكون توجيهاتي قادرة على إنشاء متغيرات في النطاق الفرعي ثم ربطها بنموذج ng الذي ينشئه التوجيه.أريد استخدام سمة "النموذج" من التوجيه لإنشاء المتغير للنموذج ng.في هذا المثال أريد أن يكون "العرض" حيث يوجد التعبير {{model}}.
المحلول
هل هذا ما كنت تبحث عنه؟
إذا قمت باستبدال @ مع ال = مما ستراه على وحدة التحكم الخاصة بك $scope (بدون استخدام تعبير)، قم بإلقاء نظرة على الكود والكمان أدناه.
يحرر
app.directive("range", function ($compile) {
return {
restrict: "E",
replace: true,
scope: {
min: "@",
max: "@",
model: '='
},
compile: function () {
return {
pre: function (scope, elem, attrs) {
// The directives isolated scope
console.log(scope);
// Controller scope
console.log(scope.$parent);
}
}
},
template: "<input type='range' ng-model='model' value='0' min='{{min}}' max='{{max}}'/>"
}
});
لا تنتمي إلى StackOverflow
