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

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

14
ฉันจะใช้สไตล์ CSS อย่างมีเงื่อนไขใน AngularJS ได้อย่างไร
ไตรมาสที่ 1 สมมติว่าฉันต้องการเปลี่ยนลักษณะของ "รายการ" แต่ละรายการที่ผู้ใช้ทำเครื่องหมายเพื่อลบก่อนกดปุ่ม "ลบ" หลัก (คำติชมภาพทันทีนี้ควรกำจัดความต้องการสุภาษิต "คุณแน่ใจหรือไม่" กล่องโต้ตอบ) ผู้ใช้จะทำเครื่องหมายในช่องทำเครื่องหมายเพื่อระบุรายการที่ควรจะลบ หากไม่ได้เลือกช่องทำเครื่องหมายรายการนั้นควรเปลี่ยนกลับเป็นรูปลักษณ์ปกติ เป็นวิธีที่ดีที่สุดในการใช้หรือลบสไตล์ CSS คืออะไร? ไตรมาสที่ 2 สมมติว่าฉันต้องการอนุญาตให้ผู้ใช้แต่ละคนปรับเปลี่ยนวิธีการนำเสนอไซต์ของฉันในแบบของฉัน เช่นเลือกจากชุดขนาดตัวอักษรคงที่อนุญาตให้ผู้ใช้กำหนดสีพื้นหน้าและสีพื้นหลัง ฯลฯ เป็นวิธีที่ดีที่สุดในการใช้สไตล์ CSS ที่ผู้ใช้เลือก / อินพุตคืออะไร?
309 css  angularjs 

3
แนวทางปฏิบัติที่ดีที่สุดของ SPA สำหรับการรับรองความถูกต้องและการจัดการเซสชัน
เมื่อสร้างแอพพลิเคชั่นสไตล์ SPA โดยใช้เฟรมเวิร์กเช่น Angular, Ember, React เป็นต้นคนใดที่เชื่อว่าเป็นแนวปฏิบัติที่ดีที่สุดสำหรับการพิสูจน์ตัวตนและการจัดการเซสชัน ฉันสามารถนึกถึงวิธีการพิจารณาเข้าใกล้ปัญหา ถือว่าไม่แตกต่างจากการรับรองความถูกต้องด้วยเว็บแอปพลิเคชันทั่วไปโดยสมมติว่า API และ UI มีโดเมนต้นทางเดียวกัน สิ่งนี้น่าจะเกี่ยวข้องกับการมีคุกกี้เซสชันที่เก็บข้อมูลเซสชันฝั่งเซิร์ฟเวอร์และอาจเป็นจุดสิ้นสุด API เซสชันที่เว็บรับรองความถูกต้องของ UI สามารถรับข้อมูลผู้ใช้ปัจจุบันเพื่อช่วยในการกำหนดค่าส่วนบุคคลหรืออาจกำหนดบทบาท / ความสามารถในฝั่งไคลเอ็นต์ เซิร์ฟเวอร์จะยังคงบังคับใช้กฎที่ป้องกันการเข้าถึงข้อมูลแน่นอน UI จะใช้ข้อมูลนี้เพื่อกำหนดประสบการณ์เอง ปฏิบัติต่อเหมือนลูกค้าบุคคลที่สามใด ๆ ที่ใช้ API สาธารณะและรับรองความถูกต้องกับระบบโทเค็นบางประเภทที่คล้ายกับ OAuth กลไกโทเค็นนี้จะใช้โดย UI ไคลเอนต์เพื่อรับรองความถูกต้องของทุกคำขอที่ทำกับเซิร์ฟเวอร์ API ฉันไม่ใช่ผู้เชี่ยวชาญมากนักที่นี่ แต่ # 1 ดูเหมือนจะเพียงพอสำหรับกรณีส่วนใหญ่ แต่ฉันอยากได้ยินความเห็นที่มีประสบการณ์มากกว่านี้

26
วิธีการตั้งค่าคลาสแอ็คทีฟ bootstrap navbar ด้วย Angular JS
หากฉันมี navbar ใน bootstrap กับรายการ Home | About | Contact ฉันจะตั้งค่าคลาสที่แอ็คทีฟสำหรับแต่ละไอเท็มเมนูได้อย่างไรเมื่อแอ็คทีฟ? นั่นคือฉันจะตั้งได้อย่างไรclass="active"เมื่อเส้นทางเชิงมุมอยู่ที่ #/ สำหรับบ้าน #/about สำหรับหน้าเกี่ยวกับ #/contact สำหรับหน้าติดต่อ

12
AngularJS กับ Django - แท็กแม่แบบที่ขัดแย้งกัน
ฉันต้องการใช้ AngularJS กับ Django ทั้งคู่ใช้{{ }}เป็นแท็กเทมเพลต มีวิธีง่ายๆในการเปลี่ยนหนึ่งในสองรายการนี้เพื่อใช้แท็กการสร้างเท็มเพลตแบบกำหนดเองอื่น ๆ หรือไม่?

28
ฉันจะตรวจสอบว่าฉันใช้ Angular รุ่นใดอยู่
ฉันจะบอกได้ว่าฉันใช้ Angular รุ่นใด ฉันเหนื่อย: angular --version angular --v angular -version angular -v แต่ได้รับ -bash: angular: command not found ฉันรู้โดยyeoman --versionที่ฉันกำลังใช้0.9.6 แต่จะรับรุ่นเชิงมุมได้อย่างไร
301 angularjs  angular 

13
วิธีโหลดซ้ำหรือแสดงผลทั้งหน้าใหม่โดยใช้ AngularJS
หลังจากเรนเดอร์ทั้งหน้าตามบริบทของผู้ใช้หลายคนและมี$httpการร้องขอหลายครั้งฉันต้องการให้ผู้ใช้สามารถสลับบริบทและแสดงทุกอย่างอีกครั้งอีกครั้ง (ส่ง$httpคำขอทั้งหมดฯลฯ ) หากฉันเพิ่งเปลี่ยนเส้นทางผู้ใช้ไปที่อื่นสิ่งต่าง ๆ ทำงานได้อย่างถูกต้อง: $scope.on_impersonate_success = function(response) { //$window.location.reload(); // This cancels any current request $location.path('/'); // This works as expected, if path != current_path }; $scope.impersonate = function(username) { return auth.impersonate(username) .then($scope.on_impersonate_success, $scope.on_auth_failed); }; หากฉันใช้$window.location.reload()ดังนั้นบาง$httpคำขอauth.impersonate(username)ที่กำลังรอการตอบกลับจะถูกยกเลิกดังนั้นฉันจึงไม่สามารถใช้งานได้ นอกจากนี้แฮ็ค$location.path($location.path())ก็ไม่ทำงานเช่นกัน (ไม่มีอะไรเกิดขึ้น) มีวิธีการแสดงหน้าอีกครั้งโดยไม่ต้องออกคำขอทั้งหมดอีกครั้งด้วยตนเองหรือไม่

7
ป้องกันไม่ให้เครื่องหมายปีกการั้งสองครั้งปรากฏขึ้นชั่วขณะก่อนที่ angular.js จะคอมไพล์ / แทรกเอกสาร
ดูเหมือนว่าจะเป็นปัญหาหลักใน IE เมื่อมีรูปภาพ / สคริปต์จำนวนมากที่จะโหลดอาจมีระยะเวลาที่จะแสดงตัวอักษร{{stringExpression}}ในมาร์กอัปแล้วหายไปเมื่อทำมุมกับการรวบรวม / การแก้ไขของ เอกสาร มีเหตุผลทั่วไปหรือไม่ที่ทำให้สิ่งนี้เกิดขึ้นซึ่งบ่งบอกว่าฉันกำลังทำอะไรผิดปกติหรือมีวิธีป้องกันไม่ให้เกิดขึ้น?
298 angularjs 

6
ฉันจะเรียกใช้ตัวกรอง Angular.js ด้วยอาร์กิวเมนต์หลายตัวได้อย่างไร
จากเอกสารเราสามารถเรียกตัวกรองเช่นวันที่ดังนี้: {{ myDateInScope | date: 'yyyy-MM-dd' }} Here date คือตัวกรองที่ใช้อาร์กิวเมนต์หนึ่งตัว ไวยากรณ์ในการเรียกใช้ตัวกรองที่มีพารามิเตอร์เพิ่มเติมทั้งจากแม่แบบและจากรหัส JavaScript คืออะไร
297 angularjs 

13
จะเรียกวิธีที่กำหนดไว้ในคำสั่ง AngularJS ได้อย่างไร
ฉันมีคำสั่งนี่คือรหัส: .directive('map', function() { return { restrict: 'E', replace: true, template: '<div></div>', link: function($scope, element, attrs) { var center = new google.maps.LatLng(50.1, 14.4); $scope.map_options = { zoom: 14, center: center, mapTypeId: google.maps.MapTypeId.ROADMAP }; // create map var map = new google.maps.Map(document.getElementById(attrs.id), $scope.map_options); var dirService= new google.maps.DirectionsService(); var dirRenderer= new google.maps.DirectionsRenderer() …

29
การอัพโหลดไฟล์โดยใช้ AngularJS
นี่คือรูปแบบ HTML ของฉัน: <form name="myForm" ng-submit=""> <input ng-model='file' type="file"/> <input type="submit" value='Submit'/> </form> ฉันต้องการอัพโหลดภาพจากเครื่องในเครื่องและต้องการอ่านเนื้อหาของไฟล์ที่อัพโหลด ทั้งหมดนี้ฉันต้องการใช้กับ AngularJS เมื่อฉันพยายามที่จะพิมพ์ค่าของ$scope.fileมันมาเป็นไม่ได้กำหนด

13
อะไรคือวิธีที่ดีที่สุดในการใช้คุณสมบัติตามเงื่อนไขใน AngularJS
ฉันต้องสามารถเพิ่มตัวอย่างเช่น "contenteditable" เพื่อองค์ประกอบขึ้นอยู่กับตัวแปรบูลีนในขอบเขต ตัวอย่างการใช้: <h1 attrs="{'contenteditable=\"true\"': editMode}">{{content.title}}</h1> จะส่งผลให้ contenteditable = true ถูกเพิ่มเข้ากับองค์ประกอบหาก$scope.editModeถูกตั้งค่าเป็นtrueถูกกำหนดให้มีวิธีง่าย ๆ ในการใช้ ng-class เช่นลักษณะการทำงานของคุณลักษณะ? ฉันกำลังพิจารณาที่จะเขียนคำสั่งและการแบ่งปันหากไม่ได้ แก้ไข: ฉันเห็นว่ามีความคล้ายคลึงกันระหว่างคำสั่ง attrs ที่ฉันเสนอกับng-bind-attrs แต่มันถูกลบใน 1.0.0.rc3ทำไม?

9
AngularJS: เมื่อใดควรใช้บริการแทนโรงงาน
กรุณาอดทนกับฉันที่นี่ ฉันรู้ว่ามีคำตอบอื่น ๆ เช่น: AngularJS: บริการกับผู้ให้บริการกับโรงงาน อย่างไรก็ตามฉันยังไม่สามารถคิดออกเมื่อคุณต้องการใช้บริการมากกว่าโรงงาน จากสิ่งที่ฉันสามารถบอกได้ว่าโรงงานใช้กันทั่วไปเพื่อสร้างฟังก์ชั่น "ทั่วไป" ที่สามารถเรียกใช้โดยตัวควบคุมหลายตัว: การสร้างฟังก์ชั่นตัวควบคุมทั่วไป เอกสารเชิงมุมดูเหมือนจะชอบโรงงานมากกว่าบริการ พวกเขายังอ้างถึง "บริการ" เมื่อพวกเขาใช้โรงงานซึ่งยิ่งทำให้สับสน! http://docs.angularjs.org/guide/dev_guide.services.creating_services ดังนั้นเมื่อหนึ่งจะใช้บริการ มีบางสิ่งที่เป็นไปได้หรือทำได้ง่ายกว่ามากกับบริการ มีอะไรแตกต่างที่เกิดขึ้นเบื้องหลังหรือไม่ ความแตกต่างด้านประสิทธิภาพ / หน่วยความจำ? นี่คือตัวอย่าง นอกเหนือจากวิธีการประกาศพวกเขาดูเหมือนกันและฉันไม่สามารถหาสาเหตุที่ฉันทำอย่างใดอย่างหนึ่งกับคนอื่น http://jsfiddle.net/uEpkE/ อัปเดต:จากคำตอบของโทมัสดูเหมือนจะบอกเป็นนัยว่าการบริการนั้นมีไว้สำหรับตรรกะที่ง่ายขึ้นและโรงงานสำหรับตรรกะที่ซับซ้อนมากขึ้นด้วยวิธีการส่วนตัวดังนั้นฉันจึงอัปเดตรหัสซอด้านล่างและดูเหมือนว่าทั้งสองสามารถรองรับฟังก์ชั่นส่วนตัวได้หรือไม่ myApp.factory('fooFactory', function() { var fooVar; var addHi = function(foo){ fooVar = 'Hi '+foo; } return { setFoobar: function(foo){ addHi(foo); }, getFoobar:function(){ return fooVar; } …

8
AngularJS - สร้างคำสั่งที่ใช้ ng-model
ฉันกำลังพยายามสร้างคำสั่งที่จะสร้างเขตข้อมูลอินพุตที่มี ng-model เช่นเดียวกับองค์ประกอบที่สร้างคำสั่ง นี่คือสิ่งที่ฉันเกิดขึ้นตอนนี้: HTML <!doctype html> <html ng-app="plunker" > <head> <meta charset="utf-8"> <title>AngularJS Plunker</title> <link rel="stylesheet" href="style.css"> <script>document.write("<base href=\"" + document.location + "\" />");</script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script> <script src="app.js"></script> </head> <body ng-controller="MainCtrl"> This scope value <input ng-model="name"> <my-directive ng-model="name"></my-directive> </body> </html> JavaScript var app = angular.module('plunker', []); app.controller('MainCtrl', …

6
จะเพิ่มฟังก์ชั่นต่าง ๆ ได้ในคลิกเดียว?
ฉันกำลังมองหาวิธีการดำเนินการนี้ แต่ฉันไม่พบสิ่งที่เกี่ยวข้องจนถึงตอนนี้ :( ฉันสามารถซ้อนฟังก์ชันทั้งสองได้ แต่ฉันแค่สงสัยว่ามันเป็นไปได้หรือไม่ฉันต้องการทำสิ่งนี้อย่างแท้จริง: <td><button class="btn" ng-click="edit($index) open()">Open me!</button></td> รหัส JS ของฉันในขณะนี้: $scope.open = function () { $scope.shouldBeOpen = true; }; $scope.edit = function(index){ var content_1, content_2; content_1 = $scope.people[index].name; content_2 = $scope.people[index].age; console.log(content_1); }; ฉันต้องการโทรหาทั้งสองฟังก์ชันด้วยการคลิกเพียงครั้งเดียวฉันจะทำสิ่งนี้ใน angularJS ได้อย่างไร ฉันคิดว่ามันจะตรงไปตรงมาเหมือนใน CSS เมื่อคุณเพิ่มหลายคลาส ... แต่ไม่ใช่ :(

8
$$ hashKey คืออะไรเพิ่มใน JSON.stringify ของฉัน
ฉันได้ลองดูที่หน้าสตริง Mozilla Mozilla JSONของ docs ของพวกเขาเช่นเดียวกับที่นี่ใน SO และ Google แต่ไม่พบคำอธิบาย ฉันใช้ JSOn stringify หลายครั้ง แต่ไม่เคยเจอผลลัพธ์นี้ ฉันมีอาร์เรย์ของวัตถุ JSON [ { "param_2": "Description 1", "param_0": "Name 1", "param_1": "VERSION 1" }, { "param_2": "Description 2", "param_0": "Name 2", "param_1": "VERSION 2" }, { "param_2": "Description 3", "param_0": "Name 3", "param_1": "VERSION 3" …

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