页面加载时的默认菜单选择答案

【问题标题】：Default menu selection on page load页面加载时的默认菜单选择
【发布时间】：2015-08-27 19:54:20
【问题描述】：

我有一个视图，其中包含一个菜单和一个指令。我想在页面加载时选择菜单中的第一项，然后填充指令的内容。

由于菜单的内容是从服务器文件加载的并且经常更改，我认为我不能使用默认路由，因为每次文件更改时路由都会更改名称。

events.html

<ul>
   <li ng-repeat="event in events"><a href="#/{{event.title}}">{{event.title}}</a></li>
</ul>

以下列表项会在页面加载时动态加载，但为了简洁起见，我已将其缩短以在线加载事件。

controller.js

 myApp.controller('controller', ['$scope',function($scope){    
   $scope.events = {title: 'event 1', title: 'event 2'};
 }]);

我希望在页面加载时默认选择一个菜单项，例如 $scope.events[0]。

【问题讨论】：

你是说要默认加载特定的路由吗？
Default route for angular ui router 的可能重复项
不，菜单不用于导航视图，菜单独立于视图和路由。该菜单用于定义指令中的某些内容，我希望在页面加载时选择默认菜单项。例如，$scope.events[0]。事件数据是从服务器中提取的，并且会定期更改。
“选中”是什么意思？选定的<li> 具有不同的类，因此看起来不同，还是什么？用户可以更改选择吗？如果是这样，通过做什么？我想它没有点击<a>，因为您说“它将标题传递给......并且填充了一个视图”。
我很抱歉，我的描述是错误的。作为菜单选择的结果，我正在填充指令的内容，而不是视图。

【解决方案1】：

'$scope.events' 中有重复键。我认为它应该是对象数组。

这可能有效：

$scope.$watch('events', function(newVal, oldVal){
    if(newVal.length){
        $scope.selected=$scope.events[0];
    }
});

【讨论】：