問題タブ [angular-directive]

私は単純な HTML エディターを開発しています。主なアイデアは、「レイアウトのデフォルトのテーマ」を持つことであり、コンポーネントはテーマの値をオーバーライドできます。テーマとコンポーネントのスタイルを管理するために、オブジェクトとインデックスを受け入れる単純な独立したディレクティブを作成しました。主な問題は、コンポーネントにスタイルがない場合、入力タグが空であり、論理的であることです。別の方法はありますか？

たとえば、コンポーネントにスタイルがない場合、ディレクティブ内でテーマの値が表示されますが、変更すると、テーマではなくコンポーネントのスタイルが変更されます。

このアーキテクチャが角度のある方法ではない場合、他のアプローチをアドバイスできますか?

ありがとうございました。 プランカー

コード スニペットは次のとおりです。

モデルに関連付けられた角度アプリに選択要素があります。モデルの角度を変更すると、何らかの理由で、value="?" のオプションが追加されます。これは、私の要点を説明するための jsFiddleです。なぜこれが起こっているのですか、どうすれば回避できますか?

編集:簡単な修正として value="" を使用してオプションを追加するだけでよいことはわかっていますが、私の場合、このオプションを使用することはできません。

と呼ばれるディレクティブがあり、次のようなiframely内部にあります。ng-repeat

"iterator.url"これは、値を実際の値ではなくstring として扱い.urlます。実験のために、URL を直接入力しました。

エラーが発生しSyntax Error: Token ':' is an unexpected tokenます。この値をディレクティブに渡すのに最も近いのは次のとおりです。

これにより、 の URL パラメータが解決されますが、文字列の一部として一重引用符iteratorとともに渡されます。' '

編集:一重引用符なしでそれも試しました。

そして得たError: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{iterator.url}}] starting at [{iterator.url}}]

これを行う正しい方法は何ですか？

EDIT2:ディレクティブのコードは次のとおりです。

<input>基本的にはとして使用されますが、いくつかの特別な機能を持つディレクティブを作成しています。

input問題は、このディレクティブを、多数のディレクティブまたは 、 、 などの HTML5 属性を含む可能placeholder性ng-patternのある のように扱いたいことrequiredです。ただし、ご覧のとおり、ディレクティブの属性を基になるものにinput手動で接続する必要があります。

<input>ディレクティブの属性を要素ではなく要素に配置するようAngularに指示する方法はあり<div>ますか? そうすれば、次のようなことができ<span sk-input ng-pattern="\regex\"></span>、自動的に生成されます

それ以外の

AngularJS で Date Time Range ディレクティブを作成しました。Date Time Range Calendar を取得するためにdangrossman/bootstrap-daterangepickerプラグインを使用しています。ディレクティブは正常に機能しており、モデルの値は変更されていますが、ビューは更新されていません。

誰でもこれに対する解決策を教えてください。

私が作成したディレクティブを以下に示します

プランカー

脚本

html

モデルが変更されたときに角度ビューが更新されません。ディレクティブの「onblur」イベントでモデルが変更されています。

inputNgEl.bind('blur', function () { })

モデルがディレクティブに渡され、ディレクティブがモデルのコンテンツを表示しています。

以下のプランクを見つけてください。 http://plnkr.co/edit/Ku5yOyWsa1fjnLIs2Eu3?p=preview

ここに何が欠けているか教えてください。ありがとう。

内部の値が解決されたテンプレートを出力するディレクティブを期待しています{{ }}が、そうではありません。{{argVal}}HTML文字列のリテラル部分であるかのように出力されます。

私の HTML ファイルでは、次のようにディレクティブを呼び出すだけです。

(someArrayはコントローラで として定義されています$scope.someArray = ["ola", "hi", "bonjour"];)

someArrayが機能しているため、間違いなくスコープ内にありますalert(someArray)。

では、なぜテンプレート部分が適切にレンダリングされないのでしょうか?

再帰ディレクティブを作成しようとしています。

次のようになります。

問題は、実行すると次のようになることです。

どうしたの？

発注書のモデルを構築しています。

ビューに発注書のヘッダーをレンダリングさせるとき、その発注書の ID を、明細項目用に構築したディレクティブに渡すことができるようにしたいと考えています。すなわち:

明細項目ディレクティブが初期化されると、独自のデータがロードされて明細項目が表示され、編集できるようになります。しかし、これを実行しようとすると、ディレクティブがそれ自体をレンダリングしようとしているときに purchaseOrderId がバインドされることはありません。

私は間違ったアプローチを取っていますか？これらの 2 つのオブジェクト間の責任を適切に分離して、これを達成する簡単な方法はありますか? どちらも別々の安らかなエンドポイントを介して制御されますが、相互に関係があります。

編集:有効なpo-idがバインドされるまで、initを遅らせる必要があると思いますか? 時計でやりますか？

localytics (angular) Chosen プラグインの複数のインスタンスを含む ng-view があります。プラグインの 1 つのインスタンスを含む ng-include もあります。どちらも同じページに表示されます。

angular-translate プラグインでフィルタリングされた値をレンダリングするためにdata-placeholder属性を使用しています。

最初は、言語を更新するメソッドが呼び出されたときに、翻訳されたテキストをレンダリングするすべての Chosen インスタンスに問題がありました。メソッドの最後で $route.reload() を呼び出すことでこれを回避しました (理想的ではありませんが、許容範囲です)。

私は試した：

• 翻訳の値と翻訳フィルターをインラインでバインドする
• それらをコントローラーに設定する
• $scope のプロパティを監視する (トリガーされたことがない)
• ルートをリロードする前にテンプレートを破棄する

ただし、ng-include 内のプレースホルダーは、ハード リフレッシュを使用しないと更新を拒否します。メソッドの最後で $window.location.reload() を呼び出すと、すべてのインスタンスが正しい翻訳を表示できますが、これ以外に問題を解決する方法を見つけることができませんでした。

範囲の問題だと思います。おそらく、Chosen プラグイン (ディレクティブ) が独自のスコープを作成し、ng-view と同様に、ng-include が独自のスコープを持ちます。

選択されたプラグインの外部で翻訳されているすべてのプロパティは、期待どおりに機能しています。

現在、angular-translate オブジェクトは次のようになっています。

var translationEN = { SEARCH: { 'SEARCH-BTN': 'Search' } }

したがって、次のようにインラインでバインドしています。

<div ng-bind="'SEARCH.SEARCH-BTN' | translate">

また、$translate.refresh() などの $translate のいくつかのメソッドを試しましたが、役に立ちませんでした。

誰かにアイデアがあれば、助けやコメントをいただければ幸いです。

前もって感謝します。