$ scope.myVariable没有更新，控制器角度的UI引导模式 [英] $scope.myVariable not updated in controller for angular-ui bootstrap modal

问题描述

在我看来，我有一个输入，跨度和一个按钮，像这样：

 ＆LT;脚本类型=文/ NG-模板ID =myTemplate.html＆GT;
  ＆LT;输入类型=文本NG模型=phoneNumber的＆GT;
  ＆LT;跨度＆GT; {{phoneNumber的}}＆LT; / SPAN＆GT;
  ＆LT;输入类型=按钮NG点击=点击（）＆GT;
＆LT; / SCRIPT＆GT;
 

当在文本框中键入时，跨度更新，如预期阅读的内容。但点击该按钮， phoneNumber的时，还没有更新控制器内的：

  app.controller（'myPopopCtrl'，['$范围，$ modalInstance'，
  功能（$范围，$ modalInstance）{
      $ scope.phoneNumber ='';      $ scope.click =功能（）{
        警报（$ scope.phoneNumber）; //警报只有''
      };
 

有一些错误newbe您可以在角使这使​​的东西不更新的 $范围控制器里面？

是否存在与角UI模式我需要了解一些$范围的问题？

编辑：

看起来 phoneNumber的获取2范围创建。有一次在蓝色箭头这其中，范围的电话号码：，一旦在红色箭头子范围。该视图使用 phoneNumber的在孩子的范围和控制器在父范围... phoneNumber的 p>

为什么两个作用域创建？

解决方案

NG-包括创建一个新的范围。所以传递一个对象，而不是字符串

$ scope.phone = {号：空}

模板，然后看起来像

 ＆LT;脚本类型=文/ NG-模板ID =myTemplate.html＆GT;
  ＆LT;输入类型=文本NG模型=phone.number＆GT;
  ＆LT;跨度＆GT; {{phone.number}}＆LT; / SPAN＆GT;
  ＆LT;输入类型=按钮NG点击=点击（）＆GT;
＆LT; / SCRIPT＆GT;
 

看看这个维基理解与原型继承的问题。

In my view I have an input, a span and a button like so:

<script type="text/ng-template" id="myTemplate.html">
  <input type="text" ng-model="phoneNumber">
  <span>{{ phoneNumber}}</span>
  <input type="button" ng-click="click()">
</script>

When typing in the textbox, the content of the span updates as expected reading. But when clicking the button, phoneNumber has not updated inside the controller:

app.controller('myPopopCtrl', ['$scope', '$modalInstance',
  function ($scope, $modalInstance) {
      $scope.phoneNumber= '';    

      $scope.click = function() {
        alert($scope.phoneNumber); // alerts only ''
      };

Is there some newbe mistake you can make in angular which makes stuff not updating on the $scope inside a controller?

Are there some $scope issues with the angular-ui modal I need to be aware of?

Edit:

It seems like phoneNumber gets created in 2 scopes. One time in the scope at the blue arrow which where phoneNumber: '' and once in the child scope at the red arrow. The view uses the phoneNumber in the child scope and the controller uses the phoneNumber in the parent scope...

Why are two scopes created?

解决方案

ng-include creates a new scope. So pass a object instead of string

$scope.phone={number:null}

The template then looks like

<script type="text/ng-template" id="myTemplate.html">
  <input type="text" ng-model="phone.number">
  <span>{{ phone.number}}</span>
  <input type="button" ng-click="click()">
</script>

Look at this wiki to understand the issues with prototypal inheritance.

这篇关于$ scope.myVariable没有更新，控制器角度的UI引导模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！