是这样的，要创建一个登录用的东西，但卡在自定义指令上。
登录要求有一个账号输入框，一个密码输入框。

1. 因为要兼容IE8，所以PLACEHOLDER属性不能直接用。需要使用自定义指令来完成。

2. 账号可以是手机，也可以是邮箱，也可以是普通账号。

3. 邮箱需要自动生成后缀，所以也需要自定义指令。可以设定是否需要在输入了@之后再显示邮箱提示。

4. 账号需要可以自己验证，这又要引入自定义指令来写验证（从angular官网上看到的方法，自定义验证器）。

现在要使用多重自定义指令，来完成这个东西（如果大家有更好的办法，也可以不用这个，请告诉我，谢谢）。

我的想法是，先定义一个自定义指令，可以让它的PLACEHOLDER在需要的时候显示出来。然后在此基础上定义一个EMAIL指令，当输入账号的时候，自动给它加上各种域名的后缀，以供选择。最后再在这个基础上，定义一个PASSPORT指令，可以判断当前输入的内容是不是可用的账号（手机/邮箱/普通用户名）。

但是问题来了，如果要在同一个作用域中使用多个这种自定义指令的话，指令就必须是分离作用域，但是这三层的自定义指令，没办法都定分离作用域，会报错。如果要使各个此种指令分离的话，想到使用ng-repeat，但是ng-repeat生成的class又没办法在生成之后，自动编译成正常的指令……

我知道我说的有点儿乱，如果大家有别的好办法，请交流一下，谢谢。最后上代码……

主文件

angular.module('Main', [])
    .directive('dirTextPlaceholder', [function () {
        return {
            restrict: 'C',
            priority:111,
            controller:function(){
                console.info('in textPlaceholder')
            },
            link: function (scope, iElement, iAttrs) {
                var input=iElement.find('input').eq(0);
                scope.$watch("value",function(newValue,oldValue){
                    if(!!newValue && !oldValue) 
                        input.addClass("chi-full").removeClass("chi-empty");
                    else if(!newValue && !!oldValue) 
                        input.addClass("chi-empty").removeClass("chi-full");
                });
            },
            templateUrl:"text-placeholder.html"
        };
    }])
    .directive('dirTextEmail', ['$compile','$timeout',function ($compile,$timeout) {
        var hosts='126.com|163.com|qq.com|sina.com|yeah.net'.split('|');
        return {
            restrict: 'C',
            priority:11,
            require: '?dirTextPlaceholder',
            controller:function(){
                console.info('in textEmail')
            },
            link: function (scope, iElement, iAttrs) {
                iElement.append("
")
                var input=iElement.find('input').eq(0),
                    ul=iElement.find('ul').eq(0),
                    li=angular.element('
{{email}}
');
                $compile(li)(scope);
                ul.append(li);
                scope.$watch("value",function(newValue){
                    if(newValue===undefined) return false;
                    var indexAt=newValue.indexOf('@');
                    if(scope.needAt && !~indexAt) return false;
                    scope.host=newValue.substring(indexAt);
                    var passport=newValue.substring(0,indexAt);
                    var emails=[];
                    for(var n=0;n

{{placeholder}}