基本的AngularJS指令

Question

我是AngularJS的新手。我正在尝试创建我的第一个指令。我有一些挑战。为了尝试“边做边学”，我决定通过指令创建一个自定义HTML元素。我的元素将允许用户选择一周中的某一天。我的控件模板如下所示：

myControl.tpl.html

<select>
  <option value="1">Sunday</option>
  <option value="2">Monday</option>
  <option value="3">Tuesday</option>
  <option value="4">Wednesday</option>
  <option value="5">Thursday</option>
  <option value="6">Friday</option>
  <option value="7">Saturday</option>
</select>

myControl.js

angular.module('myControls.dayPicker', [])
    .directive('myDayPicker', function () {
        return {
            restrict: 'E',
            scope: { value: '=' },
            templateUrl: 'dayPicker/myControl.tpl.html',
            controller: function ($scope) {
            }
        };
    });

该指令应该可以跨视图重用。要使用它，我希望能够输入以下代码：

selectedDay值将是我控制器中$ scope的值。出于某种原因，我似乎无法通过双向绑定工作。我该怎么做：

1. 所选日期选项值是否设置为selectedDay $ scope属性？
2. 如果已设置selectedDay，如何自动设置正确的选项？

谢谢！

Answer 1

我创建了一个工作示例，演示如何在控制器中设置选定日期：

http://jsfiddle.net/2jrGe/

这使用ng-change将数据发送回控制器中的函数：

<select ng-model="customSpice" ng-change="spicy(customSpice)">

忽略对'Spicy'东西的引用...我从AngularJS文档中的一个小提琴创建了这个例子：

http://docs.angularjs.org/guide/controller