Question

这可能是对Angular控制器如何工作的误解，但我试图理解为什么我的标签的徽章值没有被更新。

我已将此问题隔离到Codepen：https://codepen.io/tyman7/pen/JKKEbO

从HTML中提取：

<ion-tab title="Home" icon="ion-home" href="#/tab/home" badge="badgeValue" ng-controller="HomeTabCtrl">
    <ion-nav-view name="home-tab"></ion-nav-view>
</ion-tab>

摘自JS：

.controller('HomeTabCtrl', function($scope)
{      
  $scope.badgeValue = 1;

  $scope.updateTabValue = function()
  {
      $scope.badgeValue += 1;
  }
}

我最终找到了一个解决方案，涉及创建徽章值所关注的另一个控制器。我修改了孤立的Codepen，以演示：https://codepen.io/tyman7/pen/pbbRpb

从HTML中提取：

<ion-tab title="Home" icon="ion-home" href="#/tab/home" badge="badgeValue" ng-controller="HomeCtrl">
    <ion-nav-view name="home-tab"></ion-nav-view>
</ion-tab>

摘自JS：

.controller('HomeTabCtrl', function($scope)
{

})
.controller('HomeCtrl', function($scope)
{      
    $scope.badgeValue = 1;

    $scope.updateTabValue = function()
    {
        $scope.badgeValue += 1;
    }
}

问题是，我只是不明白为什么需要以这种方式完成。我在这里缺少什么基础知识？

Answer 1

你有多个HomeTabCtrl实例。它创建了一个＆＃39;标签＆＃39;状态已进入，另一个是“＆tab; tabs.home＆＃39;国家进入了。您的标签＆＃39; badgeValue在一个实例中，并且＆＃39; tabs.home＆＃39;重视另一个。对原始版本的简单修复是更改“标签”的名称。控制器到＆＃39; HomeCtrl＆＃39;而是创建一个该名称的空控制器。然后将在父作用域中调用updateTabValue并更新badgeValue。

这是一个codepen：
http://codepen.io/stich12/pen/Nrrprd

离子标签徽章值未正确更新

1 个答案: