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

私はMEAN JavaScriptスタックを使用したかったのですが、独自のWebサイトとインストール方法のいずれかである2つの異なるスタック、mean.jsとmean.ioがあることに気付きました。それで私は自分にこの質問を尋ねました：「どちらを使用しますか？」 それで、この質問に答えるために、私はコミュニティにこれらの2つの違いは何であるかを説明できるかどうか尋ねます。そして、もし可能なら賛否両論？彼らは私にとてもよく似ているからです。

335 javascript  node.js  angularjs  web-applications  mean-stack 

Angular UIルーターを使用していて、現在の状態を再読み込みしてすべてのデータを更新したい/現在の状態とその親のコントローラーを再実行したい 私は3つの州レベルがあります：directory.organisations.details directory.organisationsには、組織のリストを含むテーブルが含まれています。テーブル内のアイテムをクリックすると、$ StateParamsがアイテムのIDを渡してdirectory.organisations.detailsが読み込まれます。したがって、詳細状態では、このアイテムの詳細をロードして編集し、データを保存します。これまでのところ問題ありません。 次に、この状態をリロードしてすべてのデータを更新する必要があります。 私が試してみました： $state.transitionTo('directory.organisations'); これは親の状態になりますが、コントローラーをリロードしません。パスが変更されていないためです。理想的には、私は単にdirectory.organisations.details状態に留まり、親のすべてのデータも更新したいだけです。 私も試しました： $state.reload() $ state.reloadのAPI WIKIでこれを確認しました "（コントローラーのバグが今すぐ再インスタンス化され、すぐに修正されます）。" 何か助けていただけませんか？

333 angularjs  angular-ui  angular-ui-router 

ディレクティブ内の「親」スコープにアクセスする方法を探しています。スコープ、トランスクルード、要求、変数（またはスコープ自体）を上から渡すなど、どのような組み合わせでもかまいません。完全に逆方向に曲がってもかまいませんが、完全にハックされたものやメンテナンス不可能なものは避けたいです。たとえば$scope、preLinkパラメータからを取得し、その$siblingスコープを反復して概念的な「親」を見つけることで、今すぐ実行できることを知っています。 私が本当に望んでいるのは$watch、親スコープで式を表現できるようにすることです。私がそれを行うことができる場合、私はここで私がやろうとしていることを達成できます： AngularJS-変数を使用してパーシャルをレンダリングする方法？ 重要な注意点は、ディレクティブは同じ親スコープ内で再利用可能でなければならないということです。したがって、デフォルトの動作（スコープ：false）は機能しません。ディレクティブのインスタンスごとに個別のスコープが必要です。次に$watch、親スコープに存在する変数が必要です。 コードサンプルは1000ワードに相当するので、 app.directive('watchingMyParentScope', function() { return { require: /* ? */, scope: /* ? */, transclude: /* ? */, controller: /* ? */, compile: function(el,attr,trans) { // Can I get the $parent from the transclusion function somehow? return { pre: function($s, $e, $a, parentControl) { // Can …

327 angularjs  angularjs-directive 

2つのAngularコントローラーがあります。 function Ctrl1($scope) { $scope.prop1 = "First"; } function Ctrl2($scope) { $scope.prop2 = "Second"; $scope.both = Ctrl1.prop1 + $scope.prop2; //This is what I would like to do ideally } Ctrl1内部Ctrl2が未定義のため使用できません。しかし、そのように渡そうとすると… function Ctrl2($scope, Ctrl1) { $scope.prop2 = "Second"; $scope.both = Ctrl1.prop1 + $scope.prop2; //This is what I would like to do …

326 javascript  angularjs  angularjs-controller 

したがって、ナビゲーションメニューを作成するために、ng-repeatが別のng-repeat内にネストされています。<li>内部のng-repeatループのそれぞれに、$ indexを渡して必要なものをアプリに通知することにより、そのメニュー項目に関連するコントローラーを呼び出すng-clickを設定しました。ただし、外部のng-repeatから$ indexも渡す必要があるので、アプリはどのセクションにいるか、どのチュートリアルかを認識しています。 <ul ng-repeat="section in sections"> <li class="section_title {{section.active}}" > {{section.name}} </li> <ul> <li class="tutorial_title {{tutorial.active}}" ng-click="loadFromMenu($index)" ng-repeat="tutorial in section.tutorials"> {{tutorial.name}} </li> </ul> </ul> ここにPlunkerがありますhttp://plnkr.co/edit/bJUhI9oGEQIql9tahIJN?p=preview

322 angularjs  angularjs-ng-repeat 

ページをロードしてChromeコンソールを確認すると、次のエラーが見つかります。 正確にマップファイルは角度で何ですか？ angular.min.jsを参照しましたが、angular.min.js.mapは参照しませんでした。ちなみに角度1.2 rcリリースを使用していますが、このリリースに切り替えたときにこれらのエラーが表示され始めました。 ERRORS: GET http://localhost:44786/Scripts/angular-route.min.js.map 404 (Not Found) :44786/Scripts/angular-route.min.js.map:1 GET http://localhost:44786/Scripts/angular-animate.min.js.map 404 (Not Found) :44786/Scripts/angular-animate.min.js.map:1 GET http://localhost:44786/Scripts/angular-resource.min.js.map 404 (Not Found) :44786/Scripts/angular-resource.min.js.map:1 GET http://localhost:44786/Scripts/angular.min.js.map 404 (Not Found) :44786/Scripts/angular.min.js.map:1

322 angularjs 

AngularJSが各モデルとそのデータがそれぞれのサービスを使用してフェッチされるまで、新しいルートの表示を遅らせる方法（Gmailと同様）があるかどうか疑問に思っています。 たとえば、ProjectsControllerすべてのプロジェクトをリストしproject_index.htmlたがあり、これらがこれらのプロジェクトを示すテンプレートだったProject.query()場合、新しいページを表示する前に完全にフェッチされます。 それまでは、古いページが引き続き表示されます（たとえば、別のページを参照していて、このプロジェクトインデックスを表示することを決定した場合）。

321 javascript  angularjs  angularjs-routing 

私のスコープにはオブジェクトの配列があります。各オブジェクトのすべての値を監視したいと思います。 これは私のコードです： function TodoCtrl($scope) { $scope.columns = [ { field:'title', displayName: 'TITLE'}, { field: 'content', displayName: 'CONTENT' } ]; $scope.$watch('columns', function(newVal) { alert('columns changed'); }); } しかし、値を変更するとき、たとえばに変更TITLEするTITLE2と、alert('columns changed')決してポップされません。 配列内のオブジェクトを詳細に監視する方法は？ ライブデモがあります：http : //jsfiddle.net/SYx9b/

320 angularjs  watch 

AngularJSでアンカーハッシュリンクをうまく処理する方法を知っている人はいますかますか？ 簡単なFAQページの次のマークアップがあります <a href="#faq-1">Question 1</a> <a href="#faq-2">Question 2</a> <a href="#faq-3">Question 3</a> <h3 id="faq-1">Question 1</h3> <h3 id="faq-2">Question 2</h3> <h3 id="fa1-3">Question 3</h3> 上記のリンクのいずれかをクリックすると、AngularJSがインターセプトして、まったく別のページ（私の場合、リンクに一致するルートがないため、404ページ）にルーティングされます。 私の最初の考えは、「/ faq /：chapter」に一致するルートを作成し、対応するコントローラーチェックで作成することでした$routeParams.chapter一致する要素の後にし、jQueryを使用してその要素までスクロールすることでした。 しかし、AngularJSは再び私にたわごとを与え、とにかくページの上部にスクロールします。 だから、ここの誰かが過去に似たようなことをし、それに対する良い解決策を知っていますか？ 編集：html5Modeに切り替えると問題が解決するはずですが、とにかくIE8 +をサポートする必要があるため、受け入れられない解決策ではないかと心配しています：/

318 javascript  angularjs  anchor  hashtag 

辞書の変更を監視したいのですが、何らかの理由で監視コールバックが呼び出されません。 ここに私が使用するコントローラーがあります： function MyController($scope) { $scope.form = { name: 'my name', surname: 'surname' } $scope.$watch('form', function(newVal, oldVal){ console.log('changed'); }); } こちらがバイオリンです。 名前または姓が変更されるたびに$ watchコールバックが呼び出されることを期待していますが、それは起こりません。 それを行う正しい方法は何ですか？

317 javascript  angularjs  angularjs-scope 

AngularJSコントローラーをすべて1つのファイル（controllers.js）に格納しています。このファイルは次のように構成されています。 angular.module('myApp.controllers', []) .controller('Ctrl1', ['$scope', '$http', function($scope, $http) { }]) .controller('Ctrl2', ['$scope', '$http', function($scope, $http) } }]) 私がやりたいことは、Ctrl1とCtrl2を別々のファイルに入れることです。次に、両方のファイルをindex.htmlに含めますが、どのように構成する必要がありますか？私はこのようなことを試してみましたが、コントローラーが見つからないというエラーがWebブラウザーコンソールにスローされます。ヒントはありますか？ StackOverflowを検索したところ、同様の質問が見つかりました。ただし、この構文ではAngularの上で別のフレームワーク（CoffeeScript）を使用しているため、追跡できませんでした。 AngularJS：複数のファイルでコントローラーを作成する方法

315 javascript  angularjs  controller 

違いは何ですか： new Promise(function(res, rej) { res("aaa"); }) .then(function(result) { return "bbb"; }) .then(function(result) { console.log(result); }); コードスニペットを実行する結果を非表示スニペットを展開 この： new Promise(function(res, rej) { res("aaa"); }) .then(function(result) { return Promise.resolve("bbb"); }) .then(function(result) { console.log(result); }); コードスニペットを実行する結果を非表示スニペットを展開 .then（）のチェーニングでAngularと$ httpサービスを使用して異なる動作を取得しているので、質問しています。少しコードが多すぎるため、最初に上記の例を使用します。

314 javascript  angularjs  promise  q 

次の選択要素があるとします <select ng-options="size.code as size.name for size in sizes " ng-model="item.size.code" ng-change="update(MAGIC_THING)"> </select> 私はへのアクセスを持っているのでMAGIC_THINGは、現在選択されているサイズと同じになるように取得する方法はありsize.nameとsize.code私のコントローラには？ size.codeは、アプリの他の部分（画像のURLなど）の多くに影響しますが、ngのモデル時にitem.size.code更新されるが、item.size.name必要なものが直面しているユーザーに対しても同様に更新されます。これを行う正しい方法は、変更イベントをキャプチャしてコントローラー内の値を設定することだと思いますが、適切な値を取得するためにupdateに何を渡せるかわかりません。 これがそれについて完全に間違った方法であるなら、私は正しい方法を知りたいです。

313 angularjs 

AngularJSを使用してURLクエリパラメータの値を読みたいのですが。次のURLでHTMLにアクセスしています。 http://127.0.0.1:8080/test.html?target=bob さすがlocation.searchです"?target=bob"。targetの値にアクセスするために、Webにリストされているさまざまな例を見つけましたが、AngularJS 1.0.0rc10では機能しません。特に、以下がすべてundefinedです。 $location.search.target $location.search['target'] $location.search()['target'] 誰が何がうまくいくか知っていますか？（$locationコントローラーのパラメーターとして使用しています） 更新： 以下に解決策を掲載しましたが、完全には満足していません。開発者ガイド：Angular Services：$ locationの使用に関するドキュメントには、次のように記載されています$location。 $ locationはいつ使用する必要がありますか？ アプリケーションが現在のURLの変更に対応する必要がある場合、またはブラウザーで現在のURLを変更する場合。 私のシナリオでは、私のページはクエリパラメーターを使用して外部Webページから開かれるため、それ自体は「現在のURLの変更に反応する」ことはありません。ですから、おそらく$location仕事に適したツールではありません（醜い詳細については、以下の私の答えを参照してください）。したがって、この質問のタイトルを「$ locationを使用してAngularJSでクエリパラメーターを読み取る方法」から変更しました。「AngularJSでクエリパラメータを読み取る最も簡潔な方法は何ですか？」明らかに、JavaScriptと正規表現を使用して解析することができlocation.searchますが、非常に基本的な何かのために低レベルにすると、プログラマーの感性が本当に気分を害します。 だから：$location私の答えよりも使用するより良い方法はありますか、それとも簡潔な代替手段はありますか？

312 angularjs  ngroute 

私はGoogleを検索しましたが、これについて何も見つかりません。 私はこのコードを持っています。 <select ng-model="somethingHere" ng-options="option.value as option.name for option in options" ></select> このようないくつかのデータで options = [{ name: 'Something Cool', value: 'something-cool-value' }, { name: 'Something Else', value: 'something-else-value' }]; そして出力はこのようなものです。 <select ng-model="somethingHere" ng-options="option.value as option.name for option in options" class="ng-pristine ng-valid"> <option value="?" selected="selected"></option> <option value="0">Something Cool</option> <option value="1">Something Else</option> …

311 javascript  angularjs  html-select