无法获取在离子后退按钮方法范围值 [英] Not able to fetch scope value in back button method in Ionic

问题描述

在同一个模板离子无法得到离子导航栏指令值。

问题 - 不管我填写文本量＆LT;输入类型=文本占位符=70NG-模式=getamt＆GT; 在下面提到code，我能够在获取金额在这里：{{} getamt} ie.if我型我56我能得到56类型的如获取金额在这里：56 BUT 我期待同在打印不更新金额{{} getamt} 但在这种情况下，我没有得到任何价值。

我需要page..so我试图做这个东西，这个值发送给我的previous。

让我知道如何解决这个奇怪的问题与离子。

 ＆LT;离子视图＆gt;
  ＆LT;离子导航栏类=扎稳＆GT;
    ＆LT;离子NAV-后退按钮类=按钮，清除NG点击=myGoBack（getamt）＆GT;
      ＆LT; I类=图标离子ios7箭头回＆GT;＆LT; / I＆GT;没有更新的金额{{getamt}}
    ＆LT; /离子NAV-后退按钮＆GT;
  ＆LT; /离子导航栏＆GT;  ＆LT;离子内容类=有-副标题填充底=真正的＆GT;
    ＆LT; D​​IV CLASS =行＆GT;
      ＆LT; D​​IV CLASS =COL COL-30＆GT;
        ＆LT;输入类型=文本占位符=70NG-模式=getamt＆GT;
      ＆LT; / DIV＆GT;
      ＆LT; D​​IV CLASS =COL COL-30项目＆GT;
        获取金额在这里：{{getamt}}
      ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
  ＆LT; /离子含量＆GT;
＆LT; /离子视图＆gt;
 

编辑 -

我的控制器code -

  .controller（'mystate2Ctrl'，函数（$范围，$ stateParams，$本地存储，$ rootScope，$ ionicHistory）{
  的console.log（----- ----- mystate2Ctrl）;  $ scope.myGoBack =功能（VAL）{
    的console.log（VAL）;
    $ ionicHistory.goBack（）;
  };  $ rootScope。在$（$ ionicView.leave功能（范围，州）{
    如果（states.stateName ==app.mystate1）{
      的console.log（在离子视图等等等等code在这里）;
    }
}）;
 

解决方案

你所面临的问题已经做嵌套的范围，特别是与你的方式使用您的样板。

的范围不是模型

我建议你到他谈到您遇到的问题，观看MISKO Hevery这部影片。在某些点他的回答是这样的：

  

只要你有NG的模式有一定有一个点在那里的某个地方。
  如果你没有一个点，你这样做是错误的。

无论如何，如果你想解决您的问题，你应该定义你的控制器的典范。

的解决方案是创建一个：

  .controller（'mystate2Ctrl'，函数（$ rootScope，$范围，$州）{  $ scope.mymodel = {getamt：0};}）;
 

现在，你可以参考模型中使用点你的观点，你的观点应该是这个样子：

 ＆LT;离子查看查看标题=我的应用＆GT;  ＆LT;离子NAV-按键侧=右级=按钮，清除NG点击=myGoBack（mymodel.getamt）＆GT;
    ＆LT; I类=图标离子ios7箭头回＆GT;＆LT; / I＆GT;没有更新的金额{{mymodel.getamt}}
  ＆LT; /离子NAV-按钮＆GT;  ＆LT;离子内容类=有-副标题填充底=真正的＆GT;
    ＆LT; D​​IV CLASS =行＆GT;
      ＆LT; D​​IV CLASS =COL COL-30＆GT;
        ＆LT;输入类型=文本占位符=70NG-模式=mymodel.getamt＆GT;
      ＆LT; / DIV＆GT;
      ＆LT; D​​IV CLASS =COL COL-30项目＆GT;
        获取金额在这里：{{mymodel.getamt}}
      ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
  ＆LT; /离子含量＆GT;
＆LT; /离子视图＆gt;
 

如果你想看看它是如何运作的，你可以检查我的 plunker 。

也许最好的办法是一个约翰爸爸建议他的角准则。

如果你仔细阅读 controllerAs视图语法 这里他说为什么你应该去为这种方式：

  

为什么？：它提倡使用的视图绑定到一个点对象
  （例如customer.name代替名），这是更上下文，更容易
  阅读，避免无可能发生的任何引用问题
  点睛。

  
  

为什么？：有助于避免与嵌套视图使用$调用父
  控制器。

这是第二plunker与 controllerAs 样本。

On same template ionic is unable to get the value in ion-nav-bar directive.

Problem - Whatever the amount I filled in textbox <input type="text" placeholder="70" ng-model="getamt"> in below mentioned code, I am able to get the same value at Getting Amt here: {{getamt}} ie.if I type 56 I am able to get 56 typed like Getting Amt here: 56 BUT I am expecting the same to print at Not updating Amt {{getamt}} but in this case I am not getting any value.

I need to send this value to my previous page..so I am trying to do this stuff.

Let me know how to fix this weird issue with ionic.

<ion-view>
  <ion-nav-bar class="bar-stable">
    <ion-nav-back-button class="button-clear" ng-click="myGoBack(getamt)">
      <i class="icon ion-ios7-arrow-back"></i> Not updating Amt {{getamt}}
    </ion-nav-back-button>
  </ion-nav-bar>

  <ion-content class="has-subheader" padding-bottom="true">
    <div class="row">
      <div class="col col-30">
        <input type="text" placeholder="70" ng-model="getamt">
      </div>
      <div class="col col-30 item">
        Getting Amt here:  {{getamt}}
      </div>
    </div>
  </ion-content>
</ion-view>

EDIT -

My controller code -

.controller('mystate2Ctrl', function($scope, $stateParams, $localstorage, $rootScope, $ionicHistory) {
  console.log("----- mystate2Ctrl -----");

  $scope.myGoBack = function(val){
    console.log(val);
    $ionicHistory.goBack();
  };

  $rootScope.$on( "$ionicView.leave", function( scopes, states ) {
    if( states.stateName == "app.mystate1" ) {
      console.log("In Ionic View blah blah code here");
    } 
});

解决方案

The problem you're facing has to do with nested scopes and in particular with the way you use your "model".

The scope is not the model.

I would suggest you to watch this video from Miško Hevery where he talks about the problem you're having. At some point he says something like this:

Whenever you have ng-model there’s gotta be a dot in there somewhere. If you don’t have a dot, you’re doing it wrong.

Anyway, if you want to fix your problem you should define a model in your controller.

The solution is to create one:

.controller('mystate2Ctrl', function($rootScope, $scope, $state) {

  $scope.mymodel = { getamt: 0 };

});

Now you can reference your model in your views using the dot and your view should look something like this:

<ion-view view-title="my-app">

  <ion-nav-buttons side="right" class="button-clear" ng-click="myGoBack(mymodel.getamt)">
    <i class="icon ion-ios7-arrow-back"></i> Not updating Amt {{mymodel.getamt}}
  </ion-nav-buttons>

  <ion-content class="has-subheader" padding-bottom="true">
    <div class="row">
      <div class="col col-30">
        <input type="text" placeholder="70" ng-model="mymodel.getamt">
      </div>
      <div class="col col-30 item">
        Getting Amt here:  {{mymodel.getamt}}
      </div>
    </div>
  </ion-content>
</ion-view>

If you want to see how it works you can check my plunker.

Probably the best approach is the one John Papa suggests in his Angular guidelines.

If you read carefully the controllerAs View Syntax here he states why you should go for this approach:

Why?: It promotes the use of binding to a "dotted" object in the View (e.g. customer.name instead of name), which is more contextual, easier to read, and avoids any reference issues that may occur without "dotting".

Why?: Helps avoid using $parent calls in Views with nested controllers.

This is a second plunker with the controllerAs sample.

这篇关于无法获取在离子后退按钮方法范围值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！