关闭模态表单后ng-bind不更新 [英] ng-bind not updating after closing modal form

查看:32
本文介绍了关闭模态表单后ng-bind不更新的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个包含一个列表项的视图.用户单击此项目后,显示模态表单.当用户更改值并关闭模式时,项目不更新.

查看:

 <离子含量><div class="list"><ion-item class="item-icon-left" ng-click="openLanguageModal()"><i class="icon ion-chatboxes"></i>{{'语言'|翻译}}<span class="item-note"><div ng-bind="选择"></div></span></ion-item>

</离子含量><script id="language-modal.html" type="text/ng-template"><div class="modal"><离子头栏><!-- <button class="button button-full button-dark" ng-click="closeLanguageModal()">{{'Done' |翻译}}--><button class="button button-clear button-positive pull-right" ng-click="closeLanguageModal()">{{'完成' |翻译}}</ion-header-bar><离子含量><离子列表><ion-radio ng-model="choice" ng-value="'en'">英文</ion-radio><ion-radio ng-model="choice" ng-value="'ru'">Русский </ion-radio></ion-list></离子含量>

</ion-view>

控制器:

app.controller('settingsController', function($scope, $ionicModal) {$ionicModal.fromTemplateUrl('language-modal.html', {范围:$范围,动画:向上滑动"}).then(函数(模态){$scope.languageModal = 模态;})$scope.choice = "en";$scope.openLanguageModal = function() {$scope.languageModal.show();}$scope.closeLanguageModal = function() {$scope.languageModal.hide();};$scope.$on('$destroy', function() {$scope.languageModal.remove();});});

我不明白为什么 ng-bind 没有更新,请帮忙

解决方案

尝试使用:

$scope.model.choice = "en";

在主控制器中(以便所有其他视图控制器可以继承此信息).

并在所有视图(设置和语言模式)中修改为:

ng-model="model.choice"

由于原型继承...

这是一个工作演示:http://codepen.io/beaver71/pen/XXaROB

I have a view with one list item. After user clicked on this item, the modal form show. When user change value and close modal, the item-not not updating.

View:

    <ion-view ng-controller="settingsController">
  <ion-content>

    <div class="list">
        <ion-item class="item-icon-left" ng-click="openLanguageModal()">
          <i class="icon ion-chatboxes"></i>
          {{'Language'| translate}}

          <span class="item-note">
            <div ng-bind="choice"></div>
          </span>
        </ion-item>

    </div>
  </ion-content>

  <script id="language-modal.html" type="text/ng-template">
    <div class="modal">
      <ion-header-bar>
      <!-- <button class="button button-full button-dark" ng-click="closeLanguageModal()">{{'Done' | translate}}</button> -->
      <button class="button button-clear button-positive pull-right" ng-click="closeLanguageModal()">
        {{'Done' | translate}}
      </button>
      </ion-header-bar>
      <ion-content>
        <ion-list>
          <ion-radio ng-model="choice" ng-value="'en'"> English </ion-radio>
          <ion-radio ng-model="choice" ng-value="'ru'"> Русский </ion-radio>
        </ion-list>
      </ion-content>
    </div>
  </script>

</ion-view>

Controller:

app.controller('settingsController', function($scope, $ionicModal) {

   $ionicModal.fromTemplateUrl('language-modal.html', {
     scope: $scope,
     animation: 'slide-in-up'
   }).then(function(modal) {
     $scope.languageModal = modal;
   })

   $scope.choice = "en";

   $scope.openLanguageModal = function() {
     $scope.languageModal.show();
   }

   $scope.closeLanguageModal = function() {
     $scope.languageModal.hide();
   };

   $scope.$on('$destroy', function() {
     $scope.languageModal.remove();
   });
});

I dont understand why the ng-bind didnt updates, help please

解决方案

Try to use:

$scope.model.choice = "en";

in a main Controller (so that all other view controllers could inheritate this info).

and in all view (settings and language-modal) modify to:

ng-model="model.choice"

due to prototypal inheritance...

Here it is a working demo: http://codepen.io/beaver71/pen/XXaROB

这篇关于关闭模态表单后ng-bind不更新的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆