问在同一窗体上使用自定义角JS指令的多个实例
EN

Stack Overflow用户

提问于 2015-07-12 23:25:57

回答 1查看 633关注 0票数 0

我尽力解决了这个问题，但没有找到可能的解决办法。

我使用同一个页面上的两个指令实例来设置两个具有不同值的文本字段的值。但是，当我选择一个时，另一个也会更改为相同的值。

任何关于这方面的见解都将受到赞赏，因为我在这个问题上已经被长期困住了。

我试过ngModel隔离范围.

每当我更改一个值时，另一个值也会受到影响。

我削减了很少的代码并创建了一个柱塞。但也不可能让它发挥作用。

我的模板

      <input class="form-control" id="lovdat" name="lov" ng-             dblclick="dblClick()" ng-keyup="keyUp($event)" ng-model="lovval.displayval"
       type="text">

我的指令

var app = angular.module('plunker', ['LOVDirective']);

app.controller('MainCtrl', function($scope) {
$scope.officeMaster = {

officeId: "",
officeName: "",
company: "",
companyId: "",
officeManager: "",
officeManagerId: "",
officeLocation: "",
isactive: ""

};
 $scope.lovvalemp = {
  displayval: "",
  dataval: ""
    }
  $scope.lovvalcomp = {
    displayval: "",
    dataval: ""
  }
});

angular.module('LOVDirective', [])
  .directive('Lov', [function() {
    return {
      scope: {
        label: '@', // optional
        changeCallback: '&',
        lovval: '=info'

      },
      restrict: 'EA',

      replace: true, // optional 
      templateUrl: 'template.html',


      link: function(scope, element, attr, ctrl) {
        scope.param = {
          "LOVType": attr.gacLovType,
          "LOVSearchString": "",
          "LOVSearchCriteria": ""
        };

        scope.alertModalPopup = {};
        scope.alertModalPopup.selectedItem = "";



        scope.dblClick = function() {
          selectdata();
        };



        scope.selectdata = function() {
          //  var entityGrid = $("#lovGrid").data("kendoGrid");

          scope.lovval.displayval = attr.gacLovType + "Sherry";
          scope.lovval.dataval = attr.gacLovType + "1";
          lovval = scope.lovval;
          // lovval.ngModel = scope.lovval.dataval;
          //ngModel.$setViewValue(scope.lovval);
          //  $("#lovdat").val = scope.lovval.displayval;
          //  $('#lovPopup').modal('hide');
        };





      }

    };
  }]);

我的Index.html

  <div class="form-group">
      <label class="control-label required" for="txthead">Manager</label>
      <lov ng-model="officeMaster.officeManager" data-gac-lov-type="EMPLOV" info="lovvalemp"></lov>
    </div>
    <div class="form-group">
      <label class="control-label required" for="txtoffice">Company</label>
      <lov ng-model="officeMaster.company" data-gac-lov-type="CMPLOV" info="lovvalcomp"></lov>

    </div>

javascript

angularjs

angularjs-directive

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-07-13 03:04:12

不打算提供一个直接的代码解决方案--不过，我会指出正确的方向。

从注释中继续，我猜您的问题来自于jQuery选择器-- $('#lovPopup')和$("#lovGrid")，它们正在选择DOM中的第一个选择器。注意显示的弹出窗口是如何在第一个输入下面出现的？在检查HTML时，您可以看到第二个表单总是隐藏的，不管是哪个输入字段是双倍的，这是无效的jQuery选择器的结果。

我更新了您的柱塞，以摆脱基本上所有的jQuery，并使用ng-show来显示和隐藏模式。我会把正确的剑道网格交给你。这是一个关于如何在角中使用kendo的示例。

更新柱塞：http://plnkr.co/edit/3FhBL2ZtkxHOO6EJ3gKF?p=preview

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/31377582

复制

xen虚拟化基础篇

其他

Xen介绍： xen是一个开放的源代码虚拟机监视器，有剑桥大学研发。它打算在单个计算机上运行多达128个满足特征的操作系统，操作系统必须进行显示地修改("移植"）以在Xen上运行(但是提供对用户应用

小小科

2018/05/02