【问题标题】:Angularjs xeditable typehead not updating the scopeAngularjs可编辑预先输入不更新范围
【发布时间】:2015-01-31 09:10:57
【问题描述】:

我正在使用 angular xeditable typehead 指令来显示自动完成下拉菜单。我正在从页面上的 json 文件中获取数据,并使用 jso 数组进行 e-typeahead。当我在输入类型中输入某些内容时,它会显示数组中的匹配值。但是当我从列表中选择任何值时,它并没有更新模型和视图。我的文件如下所示:

conroller.js

var payApp = angular.module('payRoll', ["xeditable", "ui.bootstrap"]);

payApp.controller('mainCtrl', function($scope, $http, $window,$location, $filter) {
$scope.Zip_City_options = ["1000  BOURG EN BRESSE",
    "1000  BROU",
    "1000  ST DENIS LES BOURG",
    "1090  AMAREINS",
    "1090  AMAREINS FRANCHELEINS CES",
    "1090  CESSEINS",
    "1090  GENOUILLEUX",
    "1090  GUEREINS",
    "1090  LURCY",
    "1090  MONTCEAUX",
    "1090  MONTMERLE SUR SAONE",
    "1100  APREMONT",
    "1100  ARBENT",
    "1100  BOUVENT",
    "1100  GEOVREISSET",
    "1100  OYONNAX",
    "1100  VEYZIAT",
    "1110  ARANC",
    "1110  BRENOD",
    "1110  CHAMPDOR",
    "1110  CORCELLES"];
   });

而html是这样的:

<div  ng-controller="mainCtrl">
   <span  class="list-group-item">
      <a href="#" ng-model="zip_code" editable-text="zip_code" e-typeahead="city for city in Zip_City_options | filter:$viewValue | limitTo:8">
         {{ zip_code || '58.29C' }}
      </a>                       
   </span>
</div>

【问题讨论】:

    标签: javascript angularjs angular-ui-bootstrap x-editable


    【解决方案1】:

    将您的控制器更改为跟随

        var payApp = angular.module('payRoll', ["xeditable", "ui.bootstrap"]);
    
        payApp.controller('mainCtrl', function($scope, $http, $window,$location, $filter) {
        $scope.Zip_City_options = ["1000  BOURG EN BRESSE",
            "1000  BROU",
            "1000  ST DENIS LES BOURG",
            "1090  AMAREINS",
            "1090  AMAREINS FRANCHELEINS CES",
            "1090  CESSEINS",
            "1090  GENOUILLEUX",
            "1090  GUEREINS",
            "1090  LURCY",
            "1090  MONTCEAUX",
            "1090  MONTMERLE SUR SAONE",
            "1100  APREMONT",
            "1100  ARBENT",
            "1100  BOUVENT",
            "1100  GEOVREISSET",
            "1100  OYONNAX",
            "1100  VEYZIAT",
            "1110  ARANC",
            "1110  BRENOD",
            "1110  CHAMPDOR",
            "1110  CORCELLES"];
    
        $scope.model = {
           zip_code: null
        };
    });
    

    将您的标记更改为关注

        <div  ng-controller="mainCtrl">
        <span  class="list-group-item">
        <a href="#" editable-text="model.zip_code" e-typeahead="city for city in Zip_City_options | filter:$viewValue | limitTo:8">
              {{ zip_code || '58.29C' }}
       </a>                  
    
       </span>
       </div>
    

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-03-30
    • 1970-01-01
    • 2016-02-03
    • 1970-01-01
    • 2015-07-18
    • 1970-01-01
    相关资源
    最近更新 更多