問題タブ [angularjs]

次のように、Bootstrapのマークアップを使用しているフォームがあります。

そこにはたくさんの定型コードがあり、次のような新しいディレクティブ（form-input）に還元したいと思います。

生成：

私は単純なテンプレートを介してこれだけ多くの作業を行っています。

しかし、私が行き詰まっているのは、より高度な機能を追加するようになったときです。

テンプレートでデフォルト値をサポートするにはどうすればよいですか？

「type」パラメータをディレクティブのオプション属性として公開したいと思います。例：

ただし、何も指定されていない場合は、デフォルトでにしたいと思います"text"。どうすればこれをサポートできますか？

属性の有無に基づいてテンプレートをカスタマイズするにはどうすればよいですか？

また、「必須」属性が存在する場合は、それをサポートできるようにしたいと思います。例えば：

requiredディレクティブにが存在する場合は<input />、出力で生成されたものに追加し、それ以外の場合は無視します。これを達成する方法がわかりません。

これらの要件は単純なテンプレートを超えており、プリコンパイルフェーズの使用を開始する必要があると思われますが、どこから始めればよいのか途方に暮れています。

ここで見つけたテーブルを作成しようとしています

しかし、それを自分のソリューションとコードに統合する必要があります。そうすると、これらの不安定な文字が表示されますが、エラーは発生しません。私のコードはここにあります

下の画像をご覧ください。

私はこれをしようとしています

私は最近、Rails 3.2.3 バックエンドを使用して AngularJS 1.0.0rc8 アプリを作成し、開発では問題なく動作しましたが、Heroku にデプロイした後、不明なプロバイダー エラーが発生しました。明らかに、アプリはサービス オブジェクトを認識できませんでした。

angular-resource.js を別のファイルとしてインクルードし、次のようにアプリ モジュールにngResourceを挿入する必要があることはわかっています。

また、ファイルが縮小されると、次のようにコントローラーオブジェクトにも注入されない限り、コントローラーは依存関係が何であるかを判断できないことも知っています。

また、Angular がブラケット表記を使用して次のような関数を渡すことを推奨する別の方法でそれを実行しようとしました。

ただし、これはどれも機能していないようです。

私のアプリケーションが提供されたリソースを確認できる唯一の方法は、次のように、Production.rb ファイルでアセットの圧縮をオフにすることでした。

これを理解するのに数時間かかりましたが、最近、同じ問題を抱えた別の Rails + AngularJS アプリを見ました。

Jens Krause は同じ結論に達し、彼のブログで説明しています: http://www.websector.de/blog/2012/01/17/fun-with-angularjs-rails-coffeescript-sass-another-cafe-townsend-例/

比較的大きなアプリがあり、アセットを圧縮する必要がある場合、Rails で Angular を使用してこれを回避するにはどうすればよいですか?

ありがとう。

チェックボックスの1つをクリックすると、もう1つのチェックボックスが自動的に更新されるように、ng-checkedの例を変更してみました。

A、B、Aの順にクリックしても、期待どおりの結果が得られません。

何が起こっているのかを理解するために、ドキュメントのどの部分を見る必要がありますか？

http://jsfiddle.net/cantcopy/ev62U/

AngularJSを使用すると、次のhtmlコードは2ではなく{{1+1}}を出力します。

以下のように「myApp」を削除すると、2が正しく印刷されます。

仕事でプロジェクトを開始していますが、どのビルド ツールを使用するのが最適かを考えていました。

全体は CoffeeScript で記述されており、クライアント側には AngularJS を使用し、サーバーには NodeJS を使用しています。

アプリにはいくつかのコンポーネントがあります。

• iPadアプリ
• iPhone アプリ (iPad とは異なる機能)
• アプリの CMS
• NodeJS サーバー

これらすべての間に大量の共有コードがあり、ここでもすべて CoffeeScript で記述されています。

どのアプリがどのコードを使用しているか (その多くは共有されている) を一覧表示できるビルド ツールが必要で、各アプリの JavaScript ファイルを別のフォルダーにビルドします。

たとえば、index.html を含む「/compiled/ipad/」というフォルダーと、js、css、img などのフォルダーをセットアップします。/compiled/ipad/js にスローするコンパイル済みのコーヒー ファイルをリストします。 (/src/shared/*.coffee からの一部、/src/ipad/*.coffee からの一部など) と、/compiled/ipad/css にスローしたいファイル。また、ファイルを簡単に連結できるようにしたいと思います。

また、テストを /src/test/ipad から /compiled/test/ipad/*.js にコンパイルします。

クライアント側の単体テストはすべてtestacularを使用して記述されていますが、サーバー側の単体テストを何に記述するかはまだわかりません。

ここでは、どのビルド ツール/構成が最適なアプローチですか? メイクファイル？グラントみたいな？私は正直なところ、ビルドシーン全体に不慣れです。

編集: Browserify を使用することにしました。ここで Angular で動作させるための私のソリューションを見つけることができます: https://groups.google.com/forum/#!topic/angular/ytoVaikOcCs

これは通常AngularJSを使用する方法ではないことを私は知っていますが、私が達成したいことはAngularJSで実行可能かどうか疑問に思いました。これが推奨される方法ではない場合、これを達成するためのヒントを教えてください。私はWebプログラミングの分野で新しいことを考慮してください。

そのため、私のプロジェクトでは、SVGとRaphaelJSを使用して、「ホルダー」div内に配置されたキャンバス上にいくつかのウィジェットを描画します。AngularJSを使用してこのウィジェットをデータにバインドしようとしています。基本的に、各ウィジェットはCustomControllerのオブジェクトにリンクされています。ウィジェットを初期化するときにCustomControllerにアクセスするにはどうすればよいですか？

とにかく、これはAngularJSを使用してSVGウィジェットでデータバインディングを実現するためですか？これはAngularJSの目的ではないと思い始めています。この場合、これを行う方法について教えてください。

アップデート：

みんなあなたの答えに感謝します！要件は、ウィジェットがユーザー入力を受け入れることであり、（モジュール性の目的で）htmlファイルに配置されないようにする必要があります。したがって、今のところ、ディレクティブが主な選択のようです。リンクメソッドでは、RaphaelJSを使用してウィジェットを描画し、編集可能なオブジェクトを描画することもできますが、この方法では、AngularJSバインディングメカニズムを適切に使用せず、ウォッチとイベントハンドラーだけになります...これは私には面倒に思えます。何らかの方法でディレクティブのtemplateプロパティにSVGタグを配置し、テンプレートで入札を行うことができればよかったのですが、それはサポートされていないようです。

これについて他のアイデアはありますか？

ところで、プロパティとjQueryで取得したHTML要素（テキストボックスなど）の間にプログラムでバインディングを適用する方法はありますか？

よろしく

AngularJS をフロントエンドとして使用して新しいアプリをセットアップしています。クライアント側のすべては HTML5 プッシュステートで行われ、Google アナリティクスでページ ビューを追跡できるようにしたいと考えています。

私は現在、大規模なアプリケーションを HTML5 ベースの Web アプリに移植しています。AngularJS でアプリの構築を開始し、AngularJS フレームワークの力を楽しんでいます。現在、1 つの問題が立ちはだかっています。

jQuery Datepicker を提供するディレクティブがありますが、モデルへのバインディングが機能していないようです。

http://jsfiddle.net/9BRNf/

私はおそらくディレクティブが機能する方法を誤解しており、フレームワークの理解のこの部分にパッチを当てることができるかどうかを確認したいと考えています. 私はたくさんの例を見てきました（githubのangularuiプロジェクトを含みますが、バインディングが発生しない理由をまだ理解していません）

どんな援助でも大歓迎です。

styleプロパティが更新されない理由がわからないようです。私のより大きなアプリケーションでは、うまく機能しているようです。

http://jsfiddle.net/ganarajpr/C2hRa/4/

これが私が現在直面している問題を示すフィドルです。入力を変更すると、divで幅と高さが更新されていることがわかります。しかし、スタイル自体は更新されていないようです。ここで私が間違っていることを誰かに教えてもらえますか？

次のすべてのシナリオを試しました

1. using$scope。$apply..-$applyがすでに進行中であることを示すエラーをスローします。
2. $rootScope。$apply-上記と同じ。
3. 他のコントローラーで$watchedされているサービスに別の変数を設定します。-変化は見られません。

誰かが私にこれに対する答えを得ることができれば本当にクールでしょう。また、正確に更新されていない理由を教えていただければ幸いです。