3a3ecabe
 Imshann
init
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
import style from "antd/lib/input/style/index.css";
class Input {
useModules = ["$compile", "esNgAntd"];
props = {
value: String,
placeholder: String,
addonBefore: String,
addonAfter: String,
disabled: Boolean,
onChange: Function,
maxLength: Number
};
state = {
inputEventTarget: null,
}
|
|
81f8a467
Imshann
调整组件前缀
|
21
|
constructor(antdFormItem, antdForm) {
|
|
3a3ecabe
Imshann
init
|
22
|
esNgAntd.createStyle("ant-input", style);
|
|
1b6f912f
Imshann
优化
|
23
24
|
// 上下文
|
|
81f8a467
Imshann
调整组件前缀
|
25
26
27
|
if (antdForm) {
this.antdForm = antdForm.getContext();
this.antdForm.state.formItems.push($scope);
|
|
1b6f912f
Imshann
优化
|
28
|
}
|
|
81f8a467
Imshann
调整组件前缀
|
29
30
|
if (antdFormItem) {
this.antdFormItem = antdFormItem.getContext();
|
|
1b6f912f
Imshann
优化
|
31
|
}
|
|
3a3ecabe
Imshann
init
|
32
|
this.props.style = $attrs.style;
|
|
3a3ecabe
Imshann
init
|
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
$element.replaceWith($compile(this.getTemplate())($scope));
}
handleClick(event) {
this.state.inputEventTarget = event;
}
handleChange() {
this.props.onChange({
event: this.state.inputEventTarget
});
}
getTemplate() {
let maxLengthAttribute = "";
let styleAttribute = "";
let idAttribute = "";
if (this.props.maxLength) {
maxLengthAttribute = `maxlength="${this.props.maxLength}"`;
}
if (this.props.style) {
styleAttribute = `style="${this.props.style}"`
}
|
|
81f8a467
Imshann
调整组件前缀
|
56
57
|
if (this.antdFormItem && this.antdFormItem.name) {
idAttribute = `id="${this.antdFormItem.name}"`;
|
|
3a3ecabe
Imshann
init
|
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
|
}
let templates = [
`<input type="text" class="ant-input" placeholder={{placeholder}} ng-change="handleChange()" ng-model="value" ng-focus="handleClick($event)" ng-disabled="disabled==='true'" ${styleAttribute} ${maxLengthAttribute} ${idAttribute}/>`,
`<span class="ant-input-group-wrapper" ng-if="addonBefore||addonAfter">
<span class="ant-input-wrapper ant-input-group" style="">
<span class="ant-input-group-addon" ng-if="addonBefore">{{addonBefore}}</span>
<input type="text" class="ant-input" ng-change="handleChange()" ng-model="value" ng-focus="handleClick($event)" ng-disabled="disabled==='true'" style="${this.props.style}" ${styleAttribute} ${maxLengthAttribute} ${idAttribute}/>
<span class="ant-input-group-addon" ng-if="addonAfter">{{addonAfter}}</span>
</span>
</span>`,
];
if (this.props.addonBefore || this.props.addonAfter) {
return templates[1]
} else {
return templates[0];
}
}
}
|