the extracted api format is pure object format
{"name":"james","city":"Taipei","country":"Taiwan"}
using ngFor to run the table cannot run out because object format is not supported
how do I change it to array format?
want to become
[
{"name":"james","city":"Taipei","country":"Taiwan"}
]
although data can be processed directly in Component or Directive, a more orthodox approach would be to implement a pipe , such as
import { PipeTransform, Pipe } from '@angular/core';
@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {
transform(value, args:string[]) : any {
let keys = [];
for (let key in value) {
keys.push(key);
}
return keys;
}
}after
*ngFor="let key of obj | keys"similarly, you can also implement the tuple format of [key, value]
. [] .push ({"name": "james", "city": "Taipei", "country": "Taiwan"}) is not OK?
let o = {"name":"james","city":"Taipei","country":"Taiwan"}
let arr = [o]what's the point of turning this array into such an array?
if you want to traverse an object, you can use for. In. or use Object.keys () and Object.values ()
es6 .
<div class="storeList curli" ng-repeat="x in storeList">{{ x.count(mid) }}< div> js $scope.storeList = res.group; data: Does it have something to do with the fact that can cycle out three div, but can t display th...
I use echarts, to click on the bar chart generated by echarts to trigger the click event for navigate jump. When entering a new route, a lifecycle function cannot be triggered, so that the data cannot be rendered to the page. ...
need to achieve effect: the placeholder, input of simulated input hides ng-change, without content display, but there seems to be a conflict that cannot determine the undeffind of ng-model! problem: it seems impossible to use ng-model to determine whe...
$scope.add = function(){ $(".showdetailsadd input").each(function () { console.log( $(this).parent().find(".colr").length == 1 && $(this).val() == "" ) if ($(this).parent().find(".colr")...
means that if done is no longer executed before start and animate leave is delayed, start will no longer be executed before the delay ends. According to the example of the official website to write a dialog component, the mouse pointer hover is ...
.invoice-img-unselected { background-image: url(" assets imgs invoice-bg.png"); } the background image cannot be loaded after being packaged with ng build ...
some scenarios are encountered during the development process using the angular4 framework. for example: there is a global drop-down list in the common component, and every time the value of the drop-down list changes, all activated subcomponents change...
I want to use Directive as a public instruction. When the mouse clicks on the target element, the content of a component is displayed, and the mouse leaves and disappears. currently I insert the component with ViewContainerRef when I click. but the in...
how do I generate different forms based on the data passed in the background? Such as user registration and user login, dynamic generation of form components? ...
at present, the project business is progressing steadily, and there is some independent time to learn. I have read some articles on front-end burying points, and I also have a theoretical understanding of the three schemes of manual burying points visu...
As soon as the project comes in, a page is loaded dynamically, but before the page is loaded, I manually switch to another page, but the original js has not been destroyed, and the code in the urlRouterProvider.when is still executing, which will cause t...
three initializations 1. Initialize 2 when defining. Initialize 3 in the constructor What is the difference between initializing in ngOnInit? Under what circumstances do you usually use which initialization? What is the order in which page render...
< H2 > ask how to judge how to change the color of the login button after entering content in two input boxes at the same time < H2 > ...
according to uib document rating to achieve a simple star score, how to count the total score when there are multiple rating on the page? html: js: :uib-rating ...
problem description I m using Angular to build a client, hoping to get the latest real-time prices from the server by clicking on the following items on the page. But when I click the client button, I report the exception of core.js:1633 ERROR Syntax...
similar to that can be scrolled at will. ...
vue.js running npm.run.dev error ERROR in . node_modules mint-ui lib style.css (. node_modules css-loader!. node_modules autoprefixer-loader!. node_modules mint-ui lib style.css) Module build failed (from . node_modules autoprefixer-loader index.js): T...
Let s talk about the project briefly first use the angular6.x version use official cli scaffolding before and after separation, the angular module invokes the api,node of node and invokes the service of the backend the packaged dist directory ...
there is a problem encountered in the ionic project. You need to upload a file through the API post, and two parameters can be adjusted on postman, but you don t know how to write it in the ionic project. If anyone encounters a similar problem, try to ...
has been executed to the yellow part, res [ data ] .itemMaterialType = 3, this.itemMaterialType= res [ data ] .itemMaterialType; this sentence has been executed, why this.itemMaterialType has always been the theoretical this.itemMaterialType=3 ...