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

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

5
AngularJS ng-click stopPropagation
テーブル行にクリックイベントがあり、この行にはクリックイベントのある削除ボタンもあります。削除ボタンをクリックすると、行のクリックイベントも発生します。 これが私のコードです。 <tbody> <tr ng-repeat="user in users" class="repeat-animation" ng-click="showUser(user, $index)"> <td>{{user.firstname}}</td> <td>{{user.lastname}}</td> <td>{{user.email}}</td> <td><button class="btn red btn-sm" ng-click="deleteUser(user.id, $index)">Delete</button></td> </tr> </tbody> showUserテーブルセルの削除ボタンをクリックしたときにイベントが発生しないようにするにはどうすればよいですか？
26
配列を繰り返すのではなく、定義された回数をng-repeatする方法？
ng-repeat常に配列を反復処理する必要がない代わりに、定義された回数を実行する方法はありますか？ たとえば、以下では、リストアイテムが$scope.number5に等しいと仮定して、リストアイテムを5回表示し、さらに番号をインクリメントして、各リストアイテムが1、2、3、4、5のようにインクリメントするようにします。 望ましい結果： <ul> <li><span>1</span></li> <li><span>2</span></li> <li><span>3</span></li> <li><span>4</span></li> <li><span>5</span></li> </ul>
21
AngularJS：サービス変数を監視する方法は？
私はサービスを持っています： factory('aService', ['$rootScope', '$resource', function ($rootScope, $resource) { var service = { foo: [] }; return service; }]); そしてfoo、HTMLでレンダリングされるリストを制御するために使用したいと思います。 <div ng-controller="FooCtrl"> <div ng-repeat="item in foo">{{ item }}</div> </div> コントローラーがいつaService.foo更新されるかを検出するために、コントローラーにaServiceを追加し、$scope次に使用するこのパターンをまとめました$scope.$watch()： function FooCtrl($scope, aService) { $scope.aService = aService; $scope.foo = aService.foo; $scope.$watch('aService.foo', function (newVal, oldVal, scope) { if(newVal) { scope.foo = newVal; …
22
AngularJS部分ビューに基づいてヘッダーを動的に変更するにはどうすればよいですか？
AngularJSの部分ビューを含めるためにng-viewを使用しており、含まれているビューに基づいてページタイトルとh1ヘッダータグを更新したいと思います。ただし、これらは部分的なビューコントローラーの範囲外であるため、コントローラーのデータセットにバインドする方法を理解できません。 ASP.NET MVCの場合、@ ViewBagを使用してこれを行うことができますが、AngularJSで同等のものを知りません。共有サービス、イベントなどについて検索しましたが、まだ機能していません。それが機能するように私の例を変更する方法は大歓迎です。 私のHTML： <html data-ng-app="myModule"> <head> <!-- include js files --> <title><!-- should changed when ng-view changes --></title> </head> <body> <h1><!-- should changed when ng-view changes --></h1> <div data-ng-view></div> </body> </html> 私のJavaScript： var myModule = angular.module('myModule', []); myModule.config(['$routeProvider', function($routeProvider) { $routeProvider. when('/test1', {templateUrl: 'test1.html', controller: Test1Ctrl}). when('/test2', {templateUrl: …
19
AngularJSでkeypressイベントを使用するにはどうすればよいですか？
下のテキストボックスでEnterキーを押すイベントをキャッチします。より明確にするためにng-repeat、tbodyに値を設定するためにを使用しています。HTMLは次のとおりです。 <td><input type="number" id="closeqty{{$index}}" class="pagination-right closefield" data-ng-model="closeqtymodel" data-ng-change="change($index)" required placeholder="{{item.closeMeasure}}" /></td> これは私のモジュールです： angular.module('components', ['ngResource']); リソースを使用してテーブルにデータを入力していますが、コントローラーコードは次のとおりです。 function Ajaxy($scope, $resource) { //controller which has resource to populate the table }
12
AngularJS：AngularJSでは、ng-bindが{{}}より優れているのはなぜですか？
私は角張ったプレゼンテーションの1つにいて、言及された会議の1人は拘束力ng-bindより優れてい{{}}ます。 理由の1つは、ng-bind変数をウォッチリストに配置し、モデルの変更がある場合にのみ、データがプッシュされて表示される一方で、{{}}毎回式を補間して（角度サイクルだと思います）、値が変更されたかどうかにかかわらず、値。 また、画面上にデータがあまりない場合でも使用でき{{}}、パフォーマンスの問題が見えなくなるとも言われています。誰かがこの問題についていくつかの光を当てることができますか？
8
ng-includeの正しい構文は何ですか？
HTMLスニペットを内に含めようとしてng-repeatいますが、インクルードを機能させることができません。の現在の構文ng-includeは以前のものとは異なるようです：私は多くの例を使用して <div ng-include src="path/file.html"></div> しかし、公式ドキュメントでは、それを使用するように言います <div ng-include="path/file.html"></div> しかし、ページの下には次のように表示されます <div ng-include src="path/file.html"></div> とにかく、私は試しました <div ng-include="views/sidepanel.html"></div> <div ng-include src="views/sidepanel.html"></div> <ng-include src="views/sidepanel.html"></ng-include> <ng-include="views/sidepanel.html"></ng-include> <ng:include src="views/sidepanel.html"></ng:include> 私のスニペットはあまりコードではありませんが、多くのことが起こっています。問題の原因となる可能性のあるテンプレートng-repeatを動的に読み込むテンプレートを読み込んだので、のコンテンツsidepanel.htmlをのみという単語に置き換えましたがfoo、まだ何もありません。 また、次のようにページでテンプレートを直接宣言してみました。 <script type="text/ng-template" id="tmpl"> foo </script> そしてng-include、スクリプトのを参照するすべてのバリエーションを実行しても、id何も実行されません。 私のページにはもっと多くのものが含まれていましたが、今ではこれだけに減らしています： <!-- index.html --> <html> <head> <!-- angular includes --> </head> <body ng-view="views/main.html"> <!-- view is actually set in the …
4
ディレクティブを定義するときの「コントローラー」、「リンク」、および「コンパイル」関数の違い
ディレクティブロジックにコントローラー関数を使用している場所と、リンクを使用している場所があります。アンギュラーホームページのタブの例では、1つのコントローラーを使用し、別のディレクティブのリンクを使用しています。2つの違いは何ですか？
6
AngularJSとjQueryの違い
私が知っているjsライブラリは1つだけで、それがjQueryです。 しかし、グループの他のコーダーは、AngularJSを新しいプロジェクトのデフォルトライブラリとして変更しています。 私はそれについて何も知りません。jQueryとどう違うのですか？ 私はすでに、jQueryで同様のタスクを実行する一連の関数を持っています。AngularJSでjQueryのものを使用できますか？
7
ng-repeat内のng-click関数にパラメーターを追加しても機能しないようです
私はng-repeatこのような単純なループを持っています： <li ng-repeat='task in tasks'> <p> {{task.name}} <button ng-click="removeTask({{task.id}})">remove</button> </li> コントローラには機能があります$scope.removeTask(taskID)。 私の知る限り、Angularは最初にビューをレンダリングし、補間{{task.id}}して数値に置き換え、次にクリックイベントでng-click文字列を評価します。 この場合ng-click、期待どおりの結果が得ng-click="removeTask(5)".られます。つまり、何もしていません。 もちろんtask.id、$tasks配列やDOM から取得するコードを書くこともできますが、これはAngularの方法のようには見えません。 では、ループng-click内のディレクティブに動的コンテンツをどのように追加できng-repeatますか？
9
AngularJSは子コントローラーから親スコープにアクセスします
コントローラを使用してセットアップしました data-ng-controller="xyzController as vm" 親/子のネストされたコントローラーを使用するシナリオがあります。を使用してネストされたhtmlの親プロパティにアクセスしても問題$parent.vm.propertyはありませんが、子コントローラ内から親プロパティにアクセスする方法を理解できません。 $ scopeを挿入してを使用しようとしました$scope.$parent.vm.propertyが、これは機能しませんか？ 誰かアドバイスをいただけますか？
8
AngularのorderBy複数フィールド
角度で複数のフィールドを同時に使用して並べ替える方法は？例として、グループごと、次にサブグループごとの拳 $scope.divisions = [{'group':1,'sub':1}, {'group':2,'sub':10}, {'group':1,'sub':2},{'group':1,'sub':20},{'group':2,'sub':1}, {'group':2,'sub':11}]; これを次のように表示したかった group：サブグループ 1-1 1-2 1-20 2-1 2-10 2-11 <select ng-model="divs" ng-options="(d.group+' - '+d.sub) for d in divisions | orderBy:'group' | orderBy:'sub'" />
4
AngularJS：$ observeメソッドと$ watchメソッドの違い
私は両方のことを知っているWatchersとはObserversで何かするとすぐに計算され$scopeAngularJSの変化。しかし、両者の違いは正確には理解できませんでした。 私の最初の理解は、関数が実行されたときに実行されるObserversHTML側の条件である角度式に対して計算Watchersされる$scope.$watch()ことです。私はきちんと考えていますか？
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.