【问题标题】:How to get the name of model passed into the function in AngularJS?如何获取传递给AngularJS函数的模型名称?
【发布时间】:2014-04-22 06:48:57
【问题描述】:

我有一个场景,我需要知道传递给函数的模型的值和名称。

我尝试了以下

$scope.rad='fff';

app.directive('kmRadio', function() {
  return{
    restrict:'E',
    compile: function(element,attrs) 
    {
      var model = {l:''};
      model.l = attrs.kmModel;
      var str1="n in ";
      var str2=attrs.kmOption;
      var repeat=str1.concat(str2);
      var htmlText='<div><div ng-switch on="format">'+
            '<div ng-switch-when="kmForm">'+
            '<div>'+
            '<div class="floatLeft">'+
            ''+attrs.title+''+
            '</div>'+
            '<ul>'+
            '<li class="rowlist" ng-repeat="'+repeat+'">&nbsp;{{n}}<input type="radio" ng-model="'+attrs.kmModel+'" name="a"  ng-click="radioValueChanged(n,'+attrs.kmModel+')"/></option>'+
            '</ul>'+
            '{{'+attrs.kmModel+'}}'+
            ''+attrs.kmModel+''+
            ''+model.l+''+
            '</div>'+
            '</div>'+
            '<div ng-switch-when="kmPreview">'+
            '<div>'+attrs.title+'<input type="radio" ng-model="'+attrs.kmModel+'" disabled="true"/></div>'+
            '</div>'+
            '</div></div>';
            element.replaceWith(htmlText);
    }
  }
})

以下代码负责调用函数

'<li class="rowlist" ng-repeat="'+repeat+'">&nbsp;{{n}}<input type="radio" ng-model="'+attrs.kmModel+'" name="a"  ng-click="radioValueChanged(n,'+attrs.kmModel+')"/></option>'+



$scope.radioValueChanged = function (value,model) {
    //alert("Changed value"+value + model);
    alert(value +" and " + model);
    //alert("model "+ model );
}

在 HTML 中,我有如下代码

    <km-radio km-model="rad" title="Gender" km-option="['De','CM','PM']"></km-radio>

当我点击 html 中的单选按钮时,我得到 o/p De 和 fff,但我需要的是 o/p De 和 rad p>

查看the plunker code 并检查指令kmRadio

【问题讨论】:

    标签: angularjs angular-ngmodel


    【解决方案1】:

    我重写了您的指令以从链接函数的属性参数中获取绑定:

    app.directive('kmRadio', function($parse) {
      return {
        restrict: 'E',
        replace: true,
        templateUrl: 'kmRadio.html',
        scope: true, 
        link: function(scope, element, attr) {
          scope.kmModel = scope.$eval(attr.kmModel);
          scope.binding = attr.kmModel;
          scope.title = attr.title;
          scope.kmOption = scope.$eval(attr.kmOption);
        }
      }
    })
    

    kmRadio.html 在哪里:

    <div>
      <div ng-switch on="format">
        <div ng-switch-when="kmForm">
          <div>
            <div class="floatLeft">{{title}}</div>
            <ul>
              <li class="rowlist" ng-repeat="n in kmOption">
                 {{n}} <input type="radio" ng-model="$parent.kmModel" ng-click="radioValueChanged(n, binding)" ng-value="n"/>
              </li>
            </ul>
            bound to: {{binding}}, value: {{kmModel}} 
          </div>
        </div>
        <div ng-switch-when="kmPreview">
          <div>{{title}}
            <input type="radio" ng-model="kmModel" disabled="true" />
          </div>
        </div>
      </div>
    </div>
    

    这是一个工作演示:http://plnkr.co/edit/2q8a8B4zNGpQ0C5V1x8D?p=preview

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-04-02
    • 1970-01-01
    • 2015-12-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多