モジュールの config 関数とディレクティブの間で変数を共有する必要があります。angularJS と formly.js を Kendo UI と組み合わせて使用しています。
formly のカスタム テンプレートはモジュールの config 関数で定義されますが、実装はディレクティブに格納されます。
ディレクティブでドロップダウンの onChange イベントがトリガーされた場合、そこからオブジェクトをモジュール構成に戻して、別の機能を実行できるようにする必要があります。
これのポイントは、私のクライアントがすべての入力の横にあるアイコンを使用して、その内容を簡単にクリアしたいということです。あなたが彼らの決定に同意するかどうかは問題ではありません。
コードの一部を次に示します。
app.config(function config(formlyConfigProvider) {
formlyConfigProvider.setType({
name: 'InputObjectDD',
wrapper: ['horizontalInput', 'bootstrapHasError'],
template: function (objAssets) {
var tmpl = '<drop-down-directive lookup-key="{{to.lookupKey}}" lookup-field="{{to.lookupField}}"
lookup-required="options.templateOptions.required" field-id="{{options.key}}"
field-value="{{to.displayField}}" ng-model="model[options.key]"></drop-down-directive>
<i ng-click=\'deleteInputContents(dataItem)\' class="k-icon k-i-close"></i>'; },
link: function (scope, elm, attrs) {
scope.deleteInputContents = function (dataItem) {
// Clear the drop downs input
}
また、Kendo ドロップダウン自体が定義されているディレクティブでは、上記の deleteInputContents() がアクセスできるように dataItem 変数を渡す必要があります。
select: function (e) {
var cmb = this;
var dataItem = this.dataItem(e.item.index());
}
誰かがこれを達成する方法または別のアプローチを考えることができれば、私は永遠に感謝します.
私がすでに試したこと：
- データを渡すサービスを作成します。モジュール構成機能でサービスにアクセスできないため、これは機能しません
- ルートスコープでグローバルとして保存します。モジュール構成関数からルートスコープにアクセスできなかったため、これも機能しませんでした