AngularJS 如果用户在 Dropdown1 上选择 year/month/week 分辨率，则用相应的值填充 Dropdown2

Question

我正在尝试执行以下任务：假设我们有一个包含选项 {year, month, week, day} 的下拉列表 (Dropdown1)。我们还有 Dropdown2，它会根据 Dropdown1 中的选择而变化。

因此，如果用户选择 'year'，Dropdown2 将包含年份 {2013,2014,2015}。如果用户选择 'month'，Dropdown2 将包含从 2013 年到今天的所有月份 {Jan 2013,Feb 2013...Jan 2015} 并且日期也是如此。我只针对 'year' 案例做到了这一点..

我不想使用Datepicker，我只想简单高效。它应该是这样的：

Answer 1

您可以将 ng-change 指令添加到您的解析列表，并调用一个方法来生成用于周期列表的值。

参见：https://docs.angularjs.org/api/ng/directive/ngChange

--

另一种选择是提前生成所有 4 个周期列表：

$scope.periodLists = {
    year: [...list of years...], 
    month: [...list of month+years...], 
    week: [...], 
    day: [...]
};

然后您的周期下拉列表 ng-model 将使用解析列表中的选项进行绑定。类似于：

ng-model="periodList[selectedResolution]"

当用户选择不同的分辨率时，第二个列表切换到 periodList[year] 或 periodList[month] ...

AngularJS 如果用户在 Dropdown1 上选择 year/month/week 分辨率，则用相应的值填充 Dropdown2

AngularJS if user chooses year/month/week resolution on Dropdown1, populate Dropdown2 with the corresponding values

angularjs

drop-down-menu

selection