AngularJS - 根据选择的值显示数据

我正在开发一个Angular应用，它有两个状态：主页和列表。

主页视图有一个表单用于创建列表，并显示已创建的列表。

列表视图根据参数ID（例如# / lists0，# / lists1，# / lists2等）显示特定列表的内容。

我试图根据选择框的值，在主页视图上显示所选列表的内容。

以下是我目前的代码：

js/app.js

angular.module('d-angular', ['ui.router'])
// 设置路由/配置
// ------------------------------
.config(['$stateProvider', '$urlRouterProvider',
    // 设置状态提供者
    function($stateProvider, $urlRouterProvider) {$stateProvider
        // 主页状态
        .state('home', {
          url: '/home',
          templateUrl: '/static/home.html',
          controller: 'MainCtrl'
        })
        // 列表状态
        .state('lists', {
          url: '/lists{id}',
          templateUrl: '/static/lists.html',
          controller: 'ListsCtrl'
        })
        $urlRouterProvider.otherwise('home');
    }
])
// 列表工厂
// 工厂用于组织和共享应用程序中的代码。
// ------------------------------
.factory('lists', [function(){
    // 创建具有列表数组的新对象
    var o = { lists: [] };
    return o;
}])
// 主控制器
// ------------------------------
.controller('MainCtrl', ['$scope', 'lists',
    // 主要范围（用于视图）
    function($scope, lists){
        // 列表数组
        $scope.lists = lists.lists;
        // 添加列表函数
        $scope.addList = function(){
            // 防止空标题
            if(!$scope.title || $scope.title === '') { 
                return;
            }
            // 将新列表推送到数组
            $scope.lists.push({
                title: $scope.title, 
                date: new Date().toJSON().slice(0,10),
                words: [
                        // 添加默认单词
                        { title: "no",  date: new Date().toJSON().slice(0,10) },
                        { title: "yes",     date: new Date().toJSON().slice(0,10) }
                        ]
            });
            // 重置标题
            $scope.title = '';
        };
    }
])
// 列表控制器
// ------------------------------
.controller('ListsCtrl', ['$scope', '$stateParams', 'lists', '$http',
    // 主要范围（用于视图）
    function($scope, $stateParams, lists, $http){
        // 根据ID获取列表
        $scope.list = lists.lists[$stateParams.id];
        // 添加单词函数
        $scope.addWord = function(){
            // 将新单词推送到数组
            $scope.list.words.push({
                title: $scope.title,
                date: new Date().toJSON().slice(0,10)
            });
        };
    }
]);

static/home.html

  
列表


  
  添加




    选择列表



    {{ word.title }} 
    {{ word.date }}
  

我不确定如何从选择框中获取特定的ID值，并使用它来显示特定列表的内容。

非常感谢您的帮助。