คำถามติดแท็ก angularjs

ใช้สำหรับคำถามเกี่ยวกับ AngularJS (1.x), เฟรมเวิร์ก JavaScript แบบโอเพ่นซอร์ส อย่าใช้แท็กนี้สำหรับ Angular 2 หรือใหม่กว่า; ใช้แท็ก [angular] แทน

29
Angularjs - องค์ประกอบ ng-cloak / ng-show กะพริบ
ฉันมีปัญหาใน angular.js ด้วยคำสั่ง / คลาสng-cloakหรือng-showหรือ Chrome ทำงานได้ดี แต่ Firefox ที่เป็นสาเหตุของการกระพริบขององค์ประกอบที่มีหรือng-cloak ng-showIMHO เกิดจากการแปลงng-cloak/ ng-showเป็นstyle="display: none;"อาจเป็นคอมไพเลอร์ javascript ของ Firefox ช้าลงเล็กน้อยดังนั้นองค์ประกอบจะปรากฏขึ้นชั่วขณะหนึ่งแล้วซ่อน ตัวอย่าง: <ul ng-show="foo != null" ng-cloak>..</ul>

6
ng-app เทียบกับ data-ng-app ความแตกต่างคืออะไร?
ฉันกำลังดูวิดีโอแนะนำเริ่มต้นนี้สำหรับangular.js ในบางช่วงเวลา (หลังจาก 12'40 ") ผู้พูดระบุว่าคุณลักษณะng-appและdata-ng-app=""มีค่าเทียบเท่าหรือน้อยกว่าภายใน<html>แท็กและเช่นนั้นng-model="my_data_bindingและdata-ng-model="my_data_binding"อย่างไรก็ตามผู้พูดบอกว่า html จะถูกตรวจสอบผ่านตัวตรวจสอบที่แตกต่างกัน ใช้ คุณสามารถอธิบายความแตกต่างระหว่างสองวิธีที่ng-คำนำหน้ากับdata-ng-คำนำหน้า?
230 html  angularjs 

17
เชิงมุม ng-repeat ในสิ่งที่ตรงกันข้าม
ฉันจะรับอาเรย์กลับด้านเป็นมุมได้อย่างไร? ฉันพยายามใช้ตัวกรอง orderBy แต่ต้องมีเพรดิเคต (เช่น 'ชื่อ') เพื่อจัดเรียง: <tr ng-repeat="friend in friends | orderBy:'name':true"> <td>{{friend.name}}</td> <td>{{friend.phone}}</td> <td>{{friend.age}}</td> <tr> มีวิธีการย้อนกลับอาร์เรย์เดิมโดยไม่ต้องเรียงลำดับ เช่นนั้น: <tr ng-repeat="friend in friends | orderBy:'':true"> <td>{{friend.name}}</td> <td>{{friend.phone}}</td> <td>{{friend.age}}</td> <tr>

10
ฟังก์ชั่นการโทรกลับ Angular ไปยังองค์ประกอบของเด็กเป็น @Input คล้ายกับวิธี AngularJS
AngularJS มีพารามิเตอร์ & ที่คุณสามารถส่งการเรียกกลับไปยังคำสั่ง (เช่นวิธีการเรียกกลับของ AngularJSเป็นไปได้ไหมที่จะส่งการเรียกกลับเป็น@InputAngular Component (เช่นด้านล่าง) ถ้าไม่ใช่สิ่งที่ใกล้เคียงที่สุดกับสิ่งที่ AngularJS ทำอะไร @Component({ selector: 'suggestion-menu', providers: [SuggestService], template: ` <div (mousedown)="suggestionWasClicked(suggestion)"> </div>`, changeDetection: ChangeDetectionStrategy.Default }) export class SuggestionMenuComponent { @Input() callback: Function; suggestionWasClicked(clickedEntry: SomeModel): void { this.callback(clickedEntry, this.query); } } <suggestion-menu callback="insertSuggestion"> </suggestion-menu>

10
คุณใช้ $ sce.trustAsHtml (สตริง) เพื่อทำซ้ำ ng-bind-html-unsafe ใน Angular 1.2+ อย่างไร
ng-bind-html-unsafe ถูกลบใน Angular 1.2 ng-bind-html-unsafeฉันพยายามที่จะดำเนินการบางสิ่งบางอย่างที่ฉันจำเป็นต้องใช้ ในเอกสารและ GitHub กระทำพวกเขาพูดว่า: ng-bind-html ให้ ng-html-bind-unsafe เช่นพฤติกรรม (innerHTML ของผลลัพธ์โดยไม่มีการฆ่าเชื้อ) เมื่อถูกผูกไว้กับผลลัพธ์ของ $ sce.trustAsHtml (สตริง) คุณจะทำสิ่งนี้ได้อย่างไร
226 angularjs 

6
เวิร์กโฟลว์ AngularJS ทั่วไปและโครงสร้างโครงการ (พร้อม Python Flask)
ฉันค่อนข้างใหม่กับความคลั่งไคล้เฟรมเวิร์กฝั่งไคลเอนต์ MV * ทั้งหมด มันไม่จำเป็นต้องเป็น AngularJS แต่ฉันเลือกมันเพราะมันให้ความรู้สึกเป็นธรรมชาติมากกว่า Knockout, Ember หรือ Backbone อย่างไรก็ตามเวิร์กโฟลว์เป็นอย่างไร ผู้คนเริ่มต้นด้วยการพัฒนาแอปพลิเคชันฝั่งไคลเอ็นต์ใน AngularJS แล้วต่อท้ายแบ็คเอนด์หรือไม่ หรือวิธีอื่น ๆ โดยการสร้างแบ็คเอนด์ใน Django, Flask, Rails ก่อนจากนั้นจึงติดตั้งแอพ AngularJS มีวิธีที่ "ถูกต้อง" ในการทำมันหรือเป็นเพียงการตั้งค่าส่วนตัวในที่สุด? ฉันยังไม่แน่ใจว่าจะจัดโครงสร้างโครงการตาม Flask หรือ AngularJS หรือไม่ แนวทางปฏิบัติของชุมชน ตัวอย่างเช่นแอป minitwit ของ Flask มีโครงสร้างดังนี้: minitwit |-- minitwit.py |-- static |-- css, js, images, etc... `-- templates |-- …

25
จำกัดความยาวของสตริงด้วย AngularJS
ฉันมีดังต่อไปนี้: <div>{{modal.title}}</div> มีวิธีที่ฉันสามารถจำกัดความยาวของสายอักขระที่จะพูด 20 ตัวอักษร? และคำถามที่ดียิ่งขึ้นก็คือมีวิธีที่ฉันสามารถเปลี่ยนสตริงให้ถูกตัดทอนและแสดง...ในตอนท้ายถ้ามันมีมากกว่า 20 ตัวอักษร?

14
คำขอส่วนหัวฟิลด์ Access-Control-Allow-Headers ไม่ได้รับอนุญาตจาก Access-Control-Allow-Headers
ฉันกำลังพยายามส่งไฟล์ไปยังเซิร์ฟเวอร์ของฉันด้วยคำขอโพสต์ แต่เมื่อมันส่งมันทำให้เกิดข้อผิดพลาด: ช่องคำขอส่วนหัวเนื้อหาไม่ได้รับอนุญาตจาก Access-Control-Allow-Headers ดังนั้นฉันจึงไปที่ข้อผิดพลาดและเพิ่มส่วนหัว: $http.post($rootScope.URL, {params: arguments}, {headers: { "Access-Control-Allow-Origin" : "*", "Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS", "Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With" } จากนั้นฉันได้รับข้อผิดพลาด: ช่องคำขอส่วนหัว Access-Control-Allow-Origin ไม่ได้รับอนุญาตจาก Access-Control-Allow-Headers ดังนั้นฉันจึงค้นหาและคำถามที่คล้ายกันเพียงข้อเดียวที่ฉันพบก็คือให้คำตอบเพียงครึ่งเดียวจากนั้นปิดหัวข้อ ฉันควรจะเพิ่ม / ลบส่วนหัวใด

10
การกำหนดเส้นทาง AngularJS โดยไม่มีแฮช '#'
ฉันกำลังเรียนรู้ AngularJS และมีสิ่งหนึ่งที่ทำให้ฉันรำคาญจริงๆ ฉันใช้$routeProviderเพื่อประกาศกฎการกำหนดเส้นทางสำหรับแอปพลิเคชันของฉัน: $routeProvider.when('/test', { controller: TestCtrl, templateUrl: 'views/test.html' }) .otherwise({ redirectTo: '/test' }); แต่เมื่อฉันนำทางไปยังแอปของฉันในเบราว์เซอร์ที่ฉันเห็นแทนapp/#/testapp/test ดังนั้นคำถามของฉันคือทำไม AngularJS เพิ่มแฮชนี้#เพื่อ URL? มีความเป็นไปได้ที่จะหลีกเลี่ยงหรือไม่?

10
ฉันจะแก้ไขคำเตือนเกี่ยวกับเงินฝากออมทรัพย์ของ UNMET ได้อย่างไร
ฉันใช้ Windows 10 พร้อม Node 5.6.0 และ npm 3.6.0 ฉันพยายามติดตั้งวัสดุเชิงมุมและ mdi ลงในโฟลเดอร์การทำงานของฉัน npm ติดตั้งข้อผิดพลาดmdi เชิงมุมกับ: +-- angular@1.5.0 +-- UNMET PEER DEPENDENCY angular-animate@^1.5.0 +-- UNMET PEER DEPENDENCY angular-aria@^1.5.0 +-- angular-material@1.0.6 +-- UNMET PEER DEPENDENCY angular-messages@^1.5.0 `-- mdi@1.4.57 npm WARN enoent ENOENT: no such file or directory, open 'C:\Users\xxxxx\Desktop\ngClassifieds\package.json' npm WARN angular-material@1.0.6 …


10
ฉันจะกำหนดค่าสภาพแวดล้อมที่แตกต่างใน Angular.js ได้อย่างไร
คุณจะจัดการตัวแปร / ค่าคงที่สำหรับสภาพแวดล้อมที่แตกต่างกันได้อย่างไร นี่อาจเป็นตัวอย่าง: API ส่วนที่เหลือของฉันคือสามารถเข้าถึงได้ในlocalhost:7080/myapi/แต่เพื่อนของฉันที่ทำงานในรหัสเดียวกันภายใต้การควบคุมเวอร์ชัน Git มี API จะนำไปใช้ใน Tomcat localhost:8099/hisapi/ของเขาใน สมมติว่าเรามีสิ่งนี้: angular .module('app', ['ngResource']) .constant('API_END_POINT','<local_end_point>') .factory('User', function($resource, API_END_POINT) { return $resource(API_END_POINT + 'user'); }); ฉันจะฉีดค่าปลายทางที่ถูกต้องของ API แบบไดนามิกได้อย่างไรขึ้นอยู่กับสภาพแวดล้อม ใน PHP ฉันมักจะทำสิ่งนี้กับconfig.username.xmlไฟล์การรวมไฟล์การกำหนดค่าพื้นฐาน (config.xml) กับไฟล์การกำหนดค่าสภาพแวดล้อมท้องถิ่นที่รู้จักโดยชื่อของผู้ใช้ แต่ฉันไม่รู้วิธีจัดการสิ่งนี้ใน JavaScript?

10
AngularJS - แอ็ตทริบิวต์ค่าบนกล่องข้อความอินพุตจะถูกละเว้นเมื่อใช้ ng-model หรือไม่?
การใช้ AngularJS ถ้าฉันตั้งค่ากล่องข้อความแบบง่าย ๆ ให้เป็นแบบ "bob" ด้านล่าง ค่าจะไม่แสดงหากng-modelมีการเพิ่มคุณสมบัติ <input type="text" id="rootFolder" ng-model="rootFolders" disabled="disabled" value="Bob" size="40"/> ใครรู้วิธีง่ายๆในการเริ่มต้นการป้อนข้อมูลนี้เพื่ออะไรและเก็บng-model? ฉันพยายามใช้ng-bindกับค่าเริ่มต้น แต่ดูเหมือนจะไม่ทำงานเช่นกัน

6
เข้าถึงดัชนีของผู้ปกครองซ้ำซ้ำจากเด็กเอ็นจีซ้ำ
ฉันต้องการใช้ดัชนีของรายการหลัก (foos) เป็นอาร์กิวเมนต์สำหรับการเรียกใช้ฟังก์ชันในรายการลูก (foos.bars) ผมพบว่าการโพสต์ที่มีคนแนะนำให้ใช้ $ ปกครอง. ดัชนี $ แต่ไม่ได้เป็นทรัพย์สินของ$index$parent ฉันจะเข้าถึงดัชนีของผู้ปกครองได้ng-repeatอย่างไร <div ng-repeat="f in foos"> <div> <div ng-repeat="b in foos.bars"> <a ng-click="addSomething($parent.$index)">Add Something</a> </div> </div> </div>

6
AngularJS สลับคลาสโดยใช้ ng-class
ฉันพยายามที่จะสลับชั้นขององค์ประกอบที่ใช้ ng-class <button class="btn"> <i ng-class="{(isAutoScroll()) ? 'icon-autoscroll' : 'icon-autoscroll-disabled'}"></i> </button> isAutoScroll (): $scope.isAutoScroll = function() { $scope.autoScroll = ($scope.autoScroll) ? false : true; return $scope.autoScroll; } โดยทั่วไปถ้า$scope.autoScrollเป็นจริงฉันต้องการ ng-class เป็นicon-autoscrollและถ้ามันเป็นเท็จฉันต้องการให้เป็นicon-autoscroll-disabled สิ่งที่ฉันมีตอนนี้ไม่ทำงานและกำลังสร้างข้อผิดพลาดนี้ในคอนโซล Error: Lexer Error: Unexpected next character at columns 18-18 [?] in expression [{(isAutoScroll()) ? 'icon-autoscroll' : 'icon-autoscroll-disabled'}]. ฉันจะทำอย่างถูกต้องได้อย่างไร แก้ไข …

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.