2017-10-15 81 views
1

爲什麼,當我改變了header.html(我選擇選項,它已被列入的index.html如下:NG-模式不更新時選擇下拉更新

<div ng-include="'views/templates/header.html'"></div> 

由於某種原因,變化不會傳播到{{vm.selectedCurrency}}被稱爲在main.html中,爲什麼會出現這種情況?

了header.html

<header class="header-style-2" ng-controller="MainController as vm"> 
    <select class="selectpicker" ng-model="vm.selectedCurrency" ng-options="o as o for o in vm.currencyTypes" ></select> 
</header> 

main.html中

<div class="popular_product"> 
    <ul class="row">    
     <!-- New Arrival --> 
     <li class="col-sm-3" ng-repeat="product in vm.menNewArrivals"> 
     <div class="items-in"> 
      <!-- Image --> 
      <img ng-src="{{ product.image }}" style="height:400px; width: auto;"> 
      <!-- Hover Details --> 
      <div class="over-item"> 
      <ul class="animated fadeIn"> 
       <li><a href=""><i class="fa fa-info"></i></a></li> 
       <li><a href=""><i class="fa fa-retweet"></i></a></li> 
       <li><a href=""><i class="fa fa-heart-o"></i></a></li> 
       <li class="full-w"> <a href="#." class="btn">ADD TO CART</a></li> 
      </ul> 
      </div> 
      <!-- Item Name --> 
      <div class="details-sec"> 
      <a href="#">{{ product.name }}</a> 
      <span class="font-montserrat"> 
       {{ product.price }} {{ vm.selectedCurrency }} 
      </span> 
      </div> 
     </div> 
     </li> 
    </ul> 
    </div> 

主controller.js

vm.menNewArrivals = {}; 
vm.currencyTypes = MainService.getCurrencyTypes(); 
vm.selectedCurrency = vm.currencyTypes[0]; 

MainService.getMenNewArrivals().then(function(result) { 
    vm.menNewArrivals = result.data.menNewArrivals; 
}); 

主service.js

function getCurrencyTypes() 
{ 
    var currencyTypes = ['GBP', 'USD', 'EUR']; 
    return currencyTypes; 
} 

回答

1

有可能是解決這個問題的雙向。

  1. 您已經在使用ng-controller="MainController as vm",你的頭HTML有它自己的ng-controller,這又是一個創造的MainController另一個實例。這意味着標題有其自己的範圍,不同於main.htmlMainController控制器,並將選定的值存儲在新的控制器實例中。從header.html刪除ng-controller將解決您的問題,通過刪除它的標題HTML將有權訪問主要的HTML控制器範圍。
  2. 如果上面不是這個原因,你可以創建一個服務在Angular應用程序的不同組件之間共享數據。在這種情況下,selectedCountry將被保存在可共享數據服務中。
+0

謝謝,2)中服務的代碼將如何? – methuselah