带有typescript的嵌套角度指令

时间:2013-12-10 16:41:29

标签: javascript angularjs angularjs-directive typescript

是否可以将Typescript与嵌套角度指令一起使用?

http://jsfiddle.net/mrajcok/StXFK/

<div ng-controller="MyCtrl">
  <div screen>
    <div component>
        <div widget>
            <button ng-click="widgetIt()">Woo Hoo</button>
        </div>
    </div>
</div>
</div>

以下Javascript如何看作打字稿代码?

var myApp = angular.module('myApp',[])

.directive('screen', function() {
    return {
        scope: true,
        controller: function() {
            this.doSomethingScreeny = function() {
                alert("screeny!");
            }
        }
    }
})

.directive('component', function() {
    return {
        scope: true,
        require: '^screen',
        controller: function($scope) {
            this.componentFunction = function() {
                $scope.screenCtrl.doSomethingScreeny();
            }
        },
        link: function(scope, element, attrs, screenCtrl) {
            scope.screenCtrl = screenCtrl
        }
    }
})

.directive('widget', function() {
    return {
        scope: true,
        require: "^component",
        link: function(scope, element, attrs, componentCtrl) {
            scope.widgetIt = function() {
                componentCtrl.componentFunction();
            };
        }
    }
})


//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.name = 'Superhero';
}

1 个答案:

答案 0 :(得分:0)

该代码应该可以正常工作。但是,作为更好的实践,如果控制器变得太大http://www.youtube.com/watch?v=WdtVn_8K17E&hd=1

,则可以使用TypeScript类