ngDirective不在看

Question

我正在尝试使用语义ui进行角度工作，特别是下拉搜索框。我尝试了很多东西，我发现因为输入类型被设置为隐藏，所以ng-model不起作用。并且因为元素的更改不是由用户直接触发的，所以ng-change也不起作用。

我的想法是使用一个指令并尝试监视input元素的属性，因为在选择了某些内容后，value属性会发生变化。我认为ngDirective应该能够通过使用范围来实现ng-model和ng-change。$ watch

我试过了，但范围值没有改变。

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

var controllers = angular.module('my.controllers', []);
controllers.controller('MyController', function($scope) {
    $scope.checked = true;
});

app.directive("ngSearch", function(){
    function link($scope, element, attrs, ctrl) {
        console.log($scope.value);
        $scope.$watch("value", function(newValue, oldValue){
            console.log(newValue, oldValue);
            console.log("value updated");
            ctrl.$setViewValue($scope.value);
        }, true);

        setTimeout(function() {console.log(attrs.value);}, 6000);
    }
    return {
        restrict: 'A',
        require: 'ngModel',
        scope: {
            "value": "@",
        },
        link: link,
    }
})

$(".ui.dropdown").dropdown();

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.js"></script>
<div ng-app="myApp">
  <div ng-conroller="MyController">
    <div class="ui fluid multiple search normal selection dropdown">
      <input type="hidden" name="country" value="test1" ng-search ng-model="users">
      <i class="dropdown icon"></i>
      <div class="default text">Select testing</div>
      <div class="menu">
        <div class="item" data-value="test1">test1</div>
        <div class="item" data-value="test2">test2</div>
        <div class="item" data-value="test3">test3</div>
      </div>
     </div>
  </div>
</div>

jsfiddle中的相同版本：http://jsfiddle.net/e5aes1fe/1/