Question

我想为占位符制作自定义角度指令。

该指令的代码如下：

class customDirective {

restrict: string = "A";
link = (scope: ng.IScope,
    instanceElement: ng.IAugmentedJQuery,
    instanceAttributes: ng.IAttributes,
    controller: any,
    transclude: ng.ITranscludeFunction) => {
    instanceElement.val((<any>instanceAttributes).tsplaceholder);
    instanceElement.on("focus", (eventObj: JQueryEventObject) => {
        if (instanceElement.val() === (<any>instanceAttributes).tsplaceholder) {
            instanceElement.removeClass("gray-textbox");
            instanceElement.val("");
        }
    });

    instanceElement.on("blur", (eventObj: JQueryEventObject) => {
        if (instanceElement.val() === "") {
            instanceElement.addClass("gray-textbox");
            instanceElement.val((<any>instanceAttributes).tsplaceholder);
        }
    });
    instanceElement.addClass("gray-textbox");
    //instanceElement.attr("value", (<any>instanceAttributes).tsplaceholder);
    //this.$compile(instanceElement.contents())(scope);
}

}

taxSimpleApp.directive("tsplaceholder", () => {
return new customDirective();
});

我正在使用html代码。

<input name="ssn2"
      id="jenish"
      type="text"
      required                               
      ng-model="myVal" 
      tsplaceholder="XXX-XX-XXXX">

我正在使用带有打字稿的角色。

但是在上面的示例中，当第一个视图加载时，它会将value属性设置为我们传递的占位符。但是在第一次失去焦点后，突然开始工作。

我不知道为什么价值（“XXX-XX-XXXX”）第一次没有出现。

如果可能，请提前感谢任何帮助。

Answer 1

instanceElement.on是一个jquery命令 - ＆gt;在它的回调结束时运行$ scope。$ apply（）来警告模型中的变化角度

您还应该使用ng-model“$ scope.myVal”而不是instanceElement.val（）为输入值指定值

在angular指令中设置element的值

1 个答案: