タグ付けされた質問 「angularjs」

オープンソースのJavaScriptフレームワークであるAngularJS(1.x)に関する質問に使用します。Angular 2以降のバージョンではこのタグを使用しないでください。代わりに、[angular]タグを使用してください。

5
Angularディレクティブの拡張
サードパーティのディレクティブ(特にAngular UI Bootstrap)に小さな変更を加えたいのですが。paneディレクティブのスコープに追加したいだけです。 angular.module('ui.bootstrap.tabs', []) .controller('TabsController', ['$scope', '$element', function($scope, $element) { // various methods }]) .directive('tabs', function() { return { // etc... }; }) .directive('pane', ['$parse', function($parse) { return { require: '^tabs', restrict: 'EA', transclude: true, scope:{ heading:'@', disabled:'@' // <- ADDED SCOPE PROPERTY HERE }, link: function(scope, element, attrs, …

4
ng-repeatのある関数によって返されたアイテムをループする方法は?
divを繰り返し作成したいのですが、アイテムは関数によって返されるオブジェクトです。ただし、次のコードはエラーを報告します。$ digest()の反復が10回に達しました。中止します!jsfiddleはこちら:http ://jsfiddle.net/BraveOstrich/awnqm/ <body ng-app> <div ng-repeat="entity in getEntities()"> Hello {{entity.id}}! </div> </body>
114 angularjs 

4
AngularJS-コントローラーで日付を変換する
私のコントローラ内でこの1387843200000形式からこれに日付を変換する方法を誰かが私に提案してくれませんか?24/12/2013 ちなみに私の日付はこのように保存され、input type="date"フィールドを含む編集フォームにバインドすると、まったく入力されません。 #Plunkerのデモはこちら。 EditCtrl app.controller("EditCtrl", [ "$scope", "$filter", "db" function ($scope, $filter, db){ // this gets me an item object var item = db.readItem(); // item date = 1387843200000 // this returns undefined item.date = $filter('date')(date[ item.date, "dd/MM/yyyy"]); }]); Edit.html-テンプレート <form name="editForm" class="form-validate"> <div class="form-group"> <label for="date">Event date.</label> <input …

5
AngularJSの親スコープ変数を更新する
2つのコントローラーがあり、1つは別のコントローラーにラップされています。これで、子スコープが親スコープからプロパティを継承することがわかりましたが、親スコープ変数を更新する方法はありますか?これまでのところ、明確な解決策はありません。 私の状況では、フォーム内にカレンダーコントローラがあります。送信時にフォームに開始日と終了日が含まれるように、親スコープ(フォーム)から開始日と終了日を更新したいと思います。


4
ng-repeatのカスタムソート関数
ユーザーが選択したオプションに応じて特定の数を表示するタイルのセットがあります。ここで、表示されている数値による並べ替えを実装したいと思います。 以下のコードは、私がそれをどのように実装したかを示しています(親カードのスコープで値を取得/設定することにより)。さて、orderBy関数は文字列を受け取るため、curOptionValueと呼ばれるカードスコープに変数を設定して並べ替えようとしましたが、機能しないようです。 だから問題は、どうやってカスタムソート関数を作成するのですか? <div ng-controller="aggViewport" > <div class="btn-group" > <button ng-click="setOption(opt.name)" ng-repeat="opt in optList" class="btn active">{{opt.name}}</button> </div> <div id="container" iso-grid width="500px" height="500px"> <div ng-repeat="card in cards" class="item {{card.class}}" ng-controller="aggCardController"> <table width="100%"> <tr> <td align="center"> <h4>{{card.name}}</h4> </td> </tr> <tr> <td align="center"><h2>{{getOption()}}</h2></td> </tr> </table> </div> </div> およびコントローラー: module.controller('aggViewport',['$scope','$location',function($scope,$location) { $scope.cards = [ …

8
AngularJsでng-repeatで(キー、値)をフィルタリングする方法は?
私は次のようなことをやろうとしています: <div ng-controller="TestCtrl"> <div ng-repeat="(k,v) in items | filter:hasSecurityId"> {{k}} {{v.pos}} </div> </div> AngularJsパーツ: function TestCtrl($scope) { $scope.items = { 'A2F0C7':{'secId':'12345', 'pos':'a20'}, 'C8B3D1':{'pos':'b10'} }; $scope.hasSecurityId = function(k,v) { return v.hasOwnProperty('secId'); } } しかし、どういうわけか、それは私にすべてのアイテムを見せています。(key、value)でフィルタリングするにはどうすればよいですか?

6
角度を付けて要素のフォーカスを設定する
角度でフォーカス要素を設定する方法の例を探した後、それらのほとんどはいくつかの変数を使用して監視してからフォーカスを設定し、ほとんどはフォーカスを設定したいフィールドごとに1つの異なる変数を使用しています。多くのフィールドを持つフォームでは、多くの異なる変数を意味します。 jqueryの方法を念頭に置いて、角度のある方法でそれを実行したいので、要素のIDを使用して任意の関数にフォーカスを設定するソリューションを作成しました。その方法は正しいです、問題がある、何でも、私がこれを角度でより良い方法で行うのを助けることができるものは何でも。 基本的に、ユーザーがディレクティブで定義したスコープ値、またはデフォルトのfocusElementを監視するディレクティブを作成します。その値が要素のIDと同じである場合、その要素はフォーカスを設定します。 angular.module('appnamehere') .directive('myFocus', function () { return { restrict: 'A', link: function postLink(scope, element, attrs) { if (attrs.myFocus == "") { attrs.myFocus = "focusElement"; } scope.$watch(attrs.myFocus, function(value) { if(value == attrs.id) { element[0].focus(); } }); element.on("blur", function() { scope[attrs.myFocus] = ""; scope.$apply(); }) } }; }); 何らかの理由でフォーカスを取得する必要がある入力は、このようになります <input …

8
angular.jsでJSONP $ http.jsonp()応答を解析する
私は$http.jsonp()関数にラップされたjsonを正常に返すangularのリクエストを使用しています: var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=jsonp_callback"; $http.jsonp(url). success(function(data, status, headers, config) { //what do I do here? }). error(function(data, status, headers, config) { $scope.error = true; }); 返されたfunction-wrapped-JSONにアクセス/解析する方法は?

7
AngularJSディレクティブはAとEを制限します
私は小さなチームで働いており、AngularJSでビルドして、いくつかの基本的な標準とベストプラクティスを維持しようとしています。特に、Angularは比較的新しいです。 私の質問は、ディレクティブに関してです。より正確には、restrictオプション。 私たちの一部はrestrict: 'E'このよう<my-directive></my-directive>にhtml を使用しています。 他の人たちはhtml restrict: 'A'を使用<div my-directive></div>している。 そして、もちろん、restrict: 'EA'上記のいずれかを使用することができます。 現時点では大した問題ではありませんが、このプロジェクトの規模が大きくなると、誰もがそれを見て、何が起こっているのかを簡単に理解してもらいたいと思います。 物事の属性または要素の方法に賛成/反対はありますか? 属性よりもsay要素を選択する場合に知っておくべき落とし穴はありますか?

6
AngularJSのPromiseで成功/エラー/最終的に/キャッチを使用する
私は$httpAngularJsで使用していますが、返されたpromiseの使用方法とエラーの処理方法がわかりません。 私はこのコードを持っています: $http .get(url) .success(function(data) { // Handle data }) .error(function(data, status) { // Handle HTTP error }) .finally(function() { // Execute logic independent of success/error }) .catch(function(error) { // Catch and handle exceptions from success/error/finally functions }); これは良い方法ですか、それとももっと簡単な方法がありますか?

6
Angular JSでCSSスタイル属性を動的に適用する
これは簡単な問題ですが、解決策を見つけることができません。 次のマークアップがあります。 <div style="width:20px; height:20px; margin-top:10px; border:solid 1px black; background-color:#ff0000;"></div> スコープにバインドする背景色が必要なので、これを試しました: <div style="{width:20px; height:20px; margin-top:10px; border:solid 1px black; background-color:{{data.backgroundCol}};}"></div> それはうまくいかなかったので、私はいくつかの調査を行ってを見つけましたがng-style、それはうまくいかなかったので、動的な部分を取り出してng-style、次のようにスタイルをハードコーディングしただけです... <div ng-style="{width:20px; height:20px; margin-top:10px; border:solid 1px black; background-color:#ff0000;}"></div> そしてそれはうまくいきません。仕組みを誤解してng-styleいますか?パッティングの方法があり{{data.backgroundCol}}、プレーンスタイル属性に、それが値を挿入するために取得するには?

17
AngularJSのオブジェクトの配列からIDで特定のオブジェクトを取得します
AngularJSウェブサイトでアクセスしたいデータを含むJSONファイルがあります。次に、配列からオブジェクトを1つだけ取得します。たとえば、IDが1のアイテムが好きです。 データは次のようになります。 { "results": [ { "id": 1, "name": "Test" }, { "id": 2, "name": "Beispiel" }, { "id": 3, "name": "Sample" } ] } 次のようなAngularJS $ http機能でデータをロードしたいと思います。 $http.get("data/SampleData.json"); 機能しています。しかし、どのようにして、取得した配列から特定のデータオブジェクト(IDによる)を取得でき$http.getますか? よろしくお願いします。 挨拶マーク

23
ディレクティブを使用したAngularJSブラウザーの自動入力回避策
AngularJSでフォームを送信し、ブラウザーにパスワードを記憶する機能を使用し、その後のログイン試行で、ブラウザーにログインフォームにユーザー名とパスワードを入力$scopeさせる場合、自動入力に基づいてモデルは変更されません。 私が見つけた唯一の汚いハックは、次のディレクティブを使用することです: app.directive("xsInputSync", ["$timeout" , function($timeout) { return { restrict : "A", require: "?ngModel", link : function(scope, element, attrs, ngModel) { $timeout(function() { if (ngModel.$viewValue && ngModel.$viewValue !== element.val()) { scope.apply(function() { ngModel.$setViewValue(element.val()); }); } console.log(scope); console.log(ngModel.$name); console.log(scope[ngModel.$name]); }, 3000); } }; }]); 問題はngModel.$setViewValue(element.val());、がelement.val()戻り値に基づいてモデルもビューも変更しないことです。どうすればそれを達成できますか?

18
Angular ng-repeat add bootstrap row every 3 or 4 cols
3列ごとにブートストラップ行クラスを挿入するための正しいパターンを探しています。colsには固定された高さがありません(そして私はそれを修正したくない)ため、これが必要です。そのため、デザインが壊れます。 これが私のコードです: <div ng-repeat="product in products"> <div ng-if="$index % 3 == 0" class="row"> <div class="col-sm-4" > ... </div> </div> </div> ただし、各行に表示される製品は1つだけです。私が最終結果として欲しいのは: <div class="row"> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> </div> <div class="row"> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> <div class="col-sm4"> ... </div> …

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.