Question

我想在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-模型=＆＃39; {{模型}}＆＃39;给你一个错误是否有办法让它从指令中读取模型属性？是可以以这种方式链接它或我必须使用$ compile来实现这一点。我希望我的指令能够在子范围中创建变量，然后将其绑定到指令生成的ng模型。我想使用＆＃34; model＆＃34;的属性。从指令为ng-model创建变量。在这个例子中，我想要＆＃34;宽度＆＃34;是{{model}}表达式的位置。

Answer 1

这是你在找什么？

如果您将@替换为=而不是您在控制器上$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}}'/>" } });（不使用表达式），请查看以下代码并进行操作。< / p>

修改

{{1}}

Fiddle

你能用NG-MODEL里面的表达吗？

1 个答案: