根據angularJS中通過下拉框選擇的值更改數據

Question

我有一個下拉框，我可以從中選擇兩個值並顯示相應的值，但不是數據我想要顯示的數據在div標籤。

這裏是Fiddle Demo

HTML：

<div ng-controller="Ctrl"> 
    <select id="sel" class="input-block-level" ng-model="list_category" ng-options="obj.id as obj.name for obj in list_categories.data"></select> 
    <p>$scope.list_category: {{list_category}}</p> 
</div> 

JS：

var app = angular.module('app', []); 

function Ctrl($scope) { 
    $scope.list_categories = { 
     data: [{ 
      id: 'id1', 
      name: 'name1' 
     }, { 
      id: 'id2', 
      name: 'name2' 
     }] 
    }; 
    $scope.list_category = 'id1'; 
} 

Answer 1

您可以使用ng-include。包含來自網址或模板文件的數據。

<select id="sel" class="input-block-level" ng-model="list_category" ng-options="obj.url as obj.name for obj in list_categories.data"></select> 

<div ng-include='list_category'></div> 

function Ctrl($scope) { 
    $scope.list_categories = { 
     data: [{ 
      id: 'id1', 
      name: 'name1', 
      url : 'template1.html' 
     }, { 
      id: 'id2', 
      name: 'name2', 
      url : 'template2.html' 
     }] 
    }; 
    $scope.list_category = 'template1.html'; 
}