angularjs 相关问题

用于关于开源JavaScript框架AngularJS(1.x)的问题。不要将此标记用于Angular 2或更高版本;相反,使用[angular]标签。

使用 Angular 在表格中显示和不显示内容

我正在从 JSON 文件获取数据并放入表格中,我想根据比较显示内容,否则将其留空或某个字符串,但它始终显示满足

回答 1 投票 0

在 Angular 模型(ajax 调用所在的角度服务)中检索当前域,以准备完整的 api url 来检索数据

我们有演示和现场站点,当我们部署应用程序进行演示时,它应该像在现场一样在演示中工作。演示 URL 将类似于 demo.xxxx.com,而现场 URL 将类似于 xxxx.com。 在角度服务层...

回答 1 投票 0

在 Angular JS 中通过 WEB API 将数据插入数据库

我是 Angular JS 和 Web API 世界的新手。最近在通过 Web API 和 Angular 将数据发送到数据库时遇到困难。我能够从 webapi 加载 JSON 数据。任何帮助都会非常感谢

回答 1 投票 0

AngularJS 与 Facebook SDK [重复]

我有一个关于 angularjs 的问题。 我想在 Facebook SDK 函数中返回值,但不允许我将它们放入变量中。 perfil_nombre 和 perfil_foto 变量返回为“

回答 1 投票 0

带有数据的假API,用于在 angularjs 中测试我的用户界面[已关闭]

我正在 angularjs 中构建一个用户界面,我想在一些根据签名响应的远程服务器上测试我的 API 签名。 例如 GET 请求 api/DocumentType/GetAll 重新...

回答 3 投票 0

$范围未在 DOM 中识别

我正在使用 OData Web API 将服务响应拉入 AngularJS。连接到我的控制器的 $scope 未在 DOM 中使用 进行识别 检查: 应用程序.js var productsApp = angu... 我正在使用 OData Web API 将服务响应拉入 AngularJS。使用 $scope 在 DOM 中无法识别连接到我的控制器的 <div> 检查: app.js var productsApp = angular.module('productsApp', []); var url = '/odata/Products'; productsApp.factory('productRepository', function ($http) { return { GetProducts: function (callback) { $http.get(url).success(callback); } } }); productsApp.controller('prodCtrl', function ($scope, productRepository) { GetProducts(); function GetProducts() { productRepository.GetProducts(function (results) { $scope.ProductData = results; }) } }); 索引.cshtml <!DOCTYPE html> <html ng-app="productsApp"> <head lang="en"> <meta charset="utf-8"> <title>CRUD App using AngularJS</title> <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.10/angular.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.10/angular-route.min.js"></script> <script src="~/Scripts/app.js"></script> </head> <body > <div ng-app="productsApp" ng-controller="prodCtrl"> <ul ng-repeat="product in ProductData"> <li>{{product.ID}}</li> <li>{{product.Name}}</li> <li>{{product.Price}}</li> <li>{{product.Category}}</li> </ul> </div> </body> </html> 产品.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace ProductService.Models { public class Product { public int ID { get; set; } public string Name { get; set; } public decimal Price { get; set; } public string Category { get; set; } } } 产品控制器.cs using System; using System.Collections.Generic; using System.Data; using System.Data.Entity; using System.Data.Entity.Infrastructure; using System.Linq; using System.Net; using System.Net.Http; using System.Threading.Tasks; using System.Web.Http; using System.Web.Http.ModelBinding; using System.Web.Http.OData; using System.Web.Http.OData.Routing; using ProductService.Models; namespace ProductService.Controllers { /* To add a route for this controller, merge these statements into the Register method of the WebApiConfig class. Note that OData URLs are case sensitive. using System.Web.Http.OData.Builder; using ProductService.Models; ODataConventionModelBuilder builder = new ODataConventionModelBuilder(); builder.EntitySet<Product>("Products"); config.Routes.MapODataRoute("odata", "odata", builder.GetEdmModel()); */ public class ProductsController : ODataController { private ProductServiceContext db = new ProductServiceContext(); // GET odata/Products [Queryable] public IQueryable<Product> GetProducts() { return db.Products; } // GET odata/Products(5) [Queryable] public SingleResult<Product> GetProduct([FromODataUri] int key) { return SingleResult.Create(db.Products.Where(product => product.ID == key)); } // PUT odata/Products(5) public async Task<IHttpActionResult> Put([FromODataUri] int key, Product product) { if (!ModelState.IsValid) { return BadRequest(ModelState); } if (key != product.ID) { return BadRequest(); } db.Entry(product).State = EntityState.Modified; try { await db.SaveChangesAsync(); } catch (DbUpdateConcurrencyException) { if (!ProductExists(key)) { return NotFound(); } else { throw; } } return Updated(product); } // POST odata/Products public async Task<IHttpActionResult> Post(Product product) { if (!ModelState.IsValid) { return BadRequest(ModelState); } db.Products.Add(product); await db.SaveChangesAsync(); return Created(product); } // PATCH odata/Products(5) [AcceptVerbs("PATCH", "MERGE")] public async Task<IHttpActionResult> Patch([FromODataUri] int key, Delta<Product> patch) { if (!ModelState.IsValid) { return BadRequest(ModelState); } Product product = await db.Products.FindAsync(key); if (product == null) { return NotFound(); } patch.Patch(product); try { await db.SaveChangesAsync(); } catch (DbUpdateConcurrencyException) { if (!ProductExists(key)) { return NotFound(); } else { throw; } } return Updated(product); } // DELETE odata/Products(5) public async Task<IHttpActionResult> Delete([FromODataUri] int key) { Product product = await db.Products.FindAsync(key); if (product == null) { return NotFound(); } db.Products.Remove(product); await db.SaveChangesAsync(); return StatusCode(HttpStatusCode.NoContent); } protected override void Dispose(bool disposing) { if (disposing) { db.Dispose(); } base.Dispose(disposing); } private bool ProductExists(int key) { return db.Products.Count(e => e.ID == key) > 0; } } } 当我使用 Google Chrome 并使用 F12 停止调试器时,我的 $scope.productsApp 数据可见,但在“元素”面板中,ng-repeat 中的 <li> 元素仅显示: 。 。 。 。 。 如果有人可以帮忙,我将不胜感激...... 谢谢 如果我添加: {{ 产品数据 | json }} 它显示的数据如下: { "odata.metadata": "localhost:51811/odata/$metadata#Products", “价值”: [ {“ID”:1, “名称”:“帽子”, “价格”:“15.00”, “类别”:“服装” } ] } 现在如何在<li>{{product.ID}}</li>中显示? 使用 $templateCache 和 for 循环作为替代方案: var app = angular.module('foo', []); function foo($templateCache) { var tmpl, lister, ProductData = { "odata.metadata": "localhost:51811/odata/$metadata#Products", "value": [ { "ID": 1, "Name": "Hat", "Price": "15.00", "Category": "Apparel" } ] }; lister = function() { var index, replacement = ""; for (index in this) { /* Avoid adding the callback function itself to the array */ if (/\n/.test(this[index]) === false) { replacement = replacement.concat("<li>",this[index],"</li>"); } } return replacement; }; ProductData.value[0].toJSON = lister; tmpl = JSON.stringify(ProductData.value[0]).replace(/"/g,""); console.log(tmpl); $templateCache.put('listContent', tmpl); } app.run(foo); <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> <div ng-app="foo"> <ul ng-include="'listContent'"></ul> </div>

回答 1 投票 0

如何在 Angular js 中使用 Web API 2 ($http post) 方法

我们无法在 Angular js 中使用 Web api2 方法 module.exports = function ($http, utils) { var self = this; self.login = 函数(凭据){ 变量配置= { 哈...

回答 1 投票 0

SPA - 处理 DTO

我想基于任何js框架实现SPA,例如角JS。我已经有许多现有的 Web API,其中包含我需要在应用程序上显示的信息。我必须再添加 1 个来管理新的

回答 1 投票 0

ionic 有时不显示列表项

我在使用 Meteor + Angular + ionic 构建的移动应用程序时遇到了一个奇怪的问题。 在其中一个选项卡上,我订阅了名为“联系人”的集合,并以 ioni 形式显示联系人列表...

回答 2 投票 0

复选框未绑定到AngularJS中的范围

我正在尝试使用 ng-model 将复选框绑定到范围。复选框的初始状态与范围模型相对应,但是当我选中/取消选中该复选框时,模型不会更改。一些

回答 5 投票 0

下拉列表中的角度数据第二次未设置

我的 Angular 发生了一些奇怪的事情。 我有一个带有编辑按钮的详细信息视图。当我按下编辑按钮时,我将对象传递到编辑视图。在编辑表单上有一些下拉框...

回答 1 投票 0

将 ArrayBuffer 响应转换为 JSON

这里我调用 GetFile ,获取响应作为 ArrayBuffer{} 对象,在网络选项卡中响应是 {"errors":["photoProof Image is not available in the system"]},如果我这样做 response.errors=undefined 。 $

回答 5 投票 0

Asp.Net Core WebAPI 中 IFormFile 始终为空

当我尝试使用 angularjs 控制器推送数据时,我遇到了问题。但我所做的(IFormFile 文件)总是空的。只有一些使用 razor 语法的示例,但没有示例...

回答 5 投票 0

Angular 如何在 Angular 服务中注入 HttpClient

我想要一个使用http请求的服务。 从 '@angular/core' 导入 { Injectable } ; 从 'rxjs' 导入 { Observable, of }; 从 '@angular/common/http' 导入 { HttpClient }; @Injectable({

回答 1 投票 0

Angular ui-select - 更新选择时更新所选内容

所以我有一个非常基本的选择,如下所示: {{$select.selected.name}} 所以我有一个非常基本的选择,如下所示: <ui-select theme="select2" search-enabled="false" ng-model="obj.myModel"> <ui-select-match>{{$select.selected.name}}</ui-select-match> <ui-select-choices repeat="item.value as item in choices"> <span> {{item.name}} </span> </ui-select-choices> </ui-select> 假设 choices 定义为 $scope.choices = [ {value: 'some_value_1', name: 'Default name'}, {value: 'some_value_2', name: 'Default name 2'} ] 现在假设用户选择了值为 some_value_1 的项目。之后,服务器响应到来,用不同的名称更新 choices 列表 $scope.choices = [ {value: 'some_value_1', name: 'Real name'}, {value: 'some_value_2', name: 'Real name 2'} ] 请注意,模型中保存的值部分保持不变。 <ui-select>中的名称仍然是默认名称,而我希望将其更改为真实名称。 plnkr.co 有没有办法让所选名称对应更新的选择? [UI-Select 列表更改时不更新当前选定的条目][1] 您在 ui-select 库之外找到了解决方案吗? 我已经在库中提出了一个解决方案来纠正这个问题,因为当选择列表更改时“$select.selected”不会更新, 在代码中,当列表更改时,ui-select 倾向于使用最后一个值,而 item.value 相同。 解决方案1。 下面的代码解释了我所说的。 ngModel.$formatters.unshift(function (inputValue) { // Keep original value for undefined and null if (isNil(inputValue)) { return inputValue; } var data = $select.parserResult && $select.parserResult.source (scope, { $select : {search:''}}), //Overwrite $search locals = {}, result; if (data){ var checkFnSingle = function(d){ locals[$select.parserResult.itemName] = d; result = $select.parserResult.modelMapper(scope, locals); // FIX by aescot https://github.com/angular-ui/ui-select/issues/2038 return angular.equals(result, inputValue); }; //If possible pass same object stored in $select.selected // here is the problem when list updated if ($select.selected && checkFnSingle($select.selected)) { return $select.selected; } for (var i = data.length - 1; i >= 0; i--) { if (checkFnSingle(data[i])) return data[i]; } } return inputValue; }); 修复:添加一行ctrl.selected = undefined; $scope.$watchCollection(ctrl.parserResult.source, function(items) { if (items === undefined || items === null) { // If the user specifies undefined or null => reset the collection // Special case: items can be undefined if the user did not initialized the collection on the scope // i.e $scope.addresses = [] is missing ctrl.items = []; } else { if (!angular.isArray(items)) { throw uiSelectMinErr('items', "Expected an array but got '{0}'.", items); } else { //Remove already selected items (ex: while searching) //TODO Should add a test ctrl.refreshItems(items); //update the view value with fresh data from items, if there is a valid model value if(angular.isDefined(ctrl.ngModel.$modelValue)) { ctrl.ngModel.$modelValue = null; //Force scope model value and ngModel value to be out of sync to re-run formatters // clear $select.selected to force update on $select.selected ctrl.selected = undefined; } } } }); 解决方案2(理论): 创建您的指令并将其添加到指令中, 在您的指令中,您需要 require 'uiSelect' 来获取控制器 以及链接函数中的访问 $select, link: function(scope, element, attrs, $select) { 更新列表时设置“$elect.selected = undefined” 您需要将其包装在绑定到服务的函数中才能打开此函数

回答 1 投票 0

使用当前选定的选项创建 if 语句

我的 Angular JS 页面上有以下下拉列表: ... 我的 Angular JS 页面上有以下下拉列表: <div class="col-md-4 fieldMargin"> <div class="dropdownIcon"> <select name="actions" id="actions" ng-init="Data.formStatus.Action=Data.Actions[0]" ng-options="option.Value for option in Data.Actions" ng-focus="ActionsLabel = true" ng-blur="ActionsLabel = false;" ng-model="Data.formStatus.Action" ></select> <label for="actions" class="labelColor" ng-class="{'dropdownLabelFloat' : (ActionsLabel || Data.formStatus.Action != null), 'dropdownLabel' : !ActionsLabel && !Data.formStatus.Action }"> Action </label> </div> </div> 这些是上述下拉菜单的选项: Test1 Test12 Test14 Test18 Test25 and so on 根据用户在上面的操作下拉列表中所做的任何选择,我想更改同一页面上另一个控件的 ng-model: 这是另一个控件: <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="Data.EmailInput.To" /> <label for="to" class="labelColor" ng-class="{'inputLabelFloat' : (ToLabel || Data.EmailInput.To!= null), 'inputLabel' : !ToLabel && !Data.EmailInput.To}"> To </label> </div> 在“操作”下拉列表中,如果用户选择“Test1”,那么我希望 ng-model 为: Data.EmailInput.To 但是如果用户从“操作”下拉列表中选择“Test18”或“Test25”,那么我希望 ng-model 为: Data.EmailInput.ToSpecialCase <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="Data.EmailInput.ToSpecialCase" /> <label for="to" class="labelColor" ng-class="{'inputLabelFloat' : (ToLabel || Data.EmailInput.To!= null), 'inputLabel' : !ToLabel && !Data.EmailInput.To}"> To </label> </div> 是否可以在 angularJs HTML 页面上做一些事情。我尝试做这样的事情: <div ng-if={{Data.formStatus.Action}} = "Test1" > <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="Data.EmailInput.To" /> <label for="to" class="labelColor" ng-class="{'inputLabelFloat' : (ToLabel || Data.EmailInput.To!= null), 'inputLabel' : !ToLabel && !Data.EmailInput.To}"> To </label> </div> </div> <div ng-else-if="Test18" or "Test25"> <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="Data.EmailInput.ToSpecialCase" /> <label for="to" class="labelColor" ng-class="{'inputLabelFloat' : (ToLabel || Data.EmailInput.To!= null), 'inputLabel' : !ToLabel && !Data.EmailInput.To}"> To </label> </div> </div> 因此,如果用户从下拉列表中选择“Test1”,那么我想显示: <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="Data.EmailInput.To" /> <label for="to" class="labelColor" ng-class="{'inputLabelFloat' : (ToLabel || Data.EmailInput.To!= null), 'inputLabel' : !ToLabel && !Data.EmailInput.To}"> To </label> </div> </div> 否则,如果用户选择“test18”或“test25”,那么我想显示: <div> <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="Data.EmailInput.ToSpecialCase" /> <label for="to" class="labelColor" ng-class="{'inputLabelFloat' : (ToLabel || Data.EmailInput.To!= null), 'inputLabel' : !ToLabel && !Data.EmailInput.To}"> To </label> </div> 我对 AngularJs 很陌生。对此的任何帮助将不胜感激。 你已经快到了,AngularJS 中没有“其他”。所以只需制作 2 个 ng-if 即可。此外,您不需要在任何 {{}} 语句(如 ng-)中使用把手 ng-if。 <div ng-if="Data.formStatus.Action == 'Test1'"> <!-- first block using the ng-model="Data.EmailInput.To" --> </div> <div ng-if="Data.formStatus.Action == 'Test18' || Data.formStatus.Action == 'Test25'"> <!-- second block using the ng-model="Data.EmailInput.ToSpecialCase" --> </div> 我不太明白 Data 在这种情况下是什么,我希望它是控制器 $scope 的 as 语法,无论如何请找到下面的工作示例供您参考,我们可以对测试 1 值进行相等检查,然后我们可以使用数组 includes 方法来检查它是否是多个值之一,测试 18 和测试 25 function Channels($scope) { $scope.ActionsLabel = false; $scope.Actions = [{ Value: 'Test1' }, { Value: 'Test18' }, { Value: 'Test25' }, ]; $scope.formStatus = { Action: '', }; $scope.EmailInput = { To: '', ToSpecialCase: '', }; } angular.module('app', []) .controller('Channels', Channels); <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app ng-controller="Channels"> <div class="col-md-4 fieldMargin"> <div class="dropdownIcon"> <select name="actions" id="actions" ng-init="formStatus.Action=Actions[0]" ng-options="option.Value for option in Actions" ng-focus="ActionsLabel = true" ng-model="formStatus.Action"></select> <label for="actions" class="labelColor"> Action </label> </div> </div> <div ng-if="formStatus.Action.Value == 'Test1'"> <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="EmailInput.To" placeholder="to" /> <label for="to" class="labelColor"> To </label> </div> </div> <div ng-if="['Test18', 'Test25'].includes(formStatus.Action.Value)"> <div class="col-md-12 inputEmailSection"> <input type="text" name="to" id="to" ng-focus="ToLabel = true" ng-blur="ToLabel = false;" ng-model="EmailInput.ToSpecialCase" placeholder="ToSpecialCase" /> <label for="to" class="labelColor"> To </label> </div> </div> </div>

回答 2 投票 0

如何在 JSON API 中访问 ACF 关系字段

我是 WordPress 粉丝,大部分时间都在使用高级自定义字段插件。 我有两个自定义帖子类型,它们与 ACF 插件中的关系字段链接在一起。我很...

回答 2 投票 0

如何将我的 postgresDB 连接到 Ionic?

如何将我的 postgresDB 连接到 Ionic???我已经被困在这个问题上有一段时间了。我尝试查看文档、视频或教程,但找不到我要找的内容。 当开始新离子时...

回答 2 投票 0

如何让 VS Code 的 Intellisense 与 AngularJS 的注入服务配合使用?

所以我试图让 Visual Studio Code 为我的 AngularJs(不是 Angular)应用程序的服务提供智能感知。我设法获得了角度的标准类型(现在当我输入“角度”时。...

回答 2 投票 0

在我的旧版 AngularJS 解决方案中实现 sqlite3.wasm Web Assembly

我需要在我的旧 AngularJS 解决方案中实现一个持久的 Sqlite3 数据库。到目前为止,我已经成功实现了瞬态 Sqlite3 数据库,但还没有成功实现持久性

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.