How to bind an object array to the view in ionic 4?Safely turning a JSON string into an objectHow to horizontally center a <div>?How to change an element's class with JavaScript?How can I pretty-print JSON in a shell script?How do I test for an empty JavaScript object?How to check whether a checkbox is checked in jQuery?Convert form data to JavaScript object with jQueryHow to disable resizable property of textarea?How do I POST JSON data with Curl from a terminal/commandline to Test Spring REST?Can't bind to 'ngModel' since it isn't a known property of 'input'
Jimmy needs your help!
Four ships at the ocean with the same distance
Can a USB hub be used to access a drive from two devices?
What is the meaning of "prairie-dog" in this sentence?
When do flights get cancelled due to fog?
Simple question about "vacuous truth".
Is it ok for parents to kiss and romance with each other while their 2- to 8-year-old child watches?
How to reclaim personal item I've lent to the office without burning bridges?
Examples of fluid (including air) being used to transmit digital data?
Why did the frequency of the word "черт" (devil) in books increase by a few times since the October Revolution?
E12 LED light bulb flickers when OFF in candelabra
Can you create a free-floating MASYU puzzle?
What is the shape of the upper boundary of water hitting a screen?
When is one 'Ready' to make Original Contributions to Mathematics?
How can I reset Safari when Safari is broken?
Why SQL does not use the indexed view?
How to evaluate the performance of open source solver?
How do resistors generate different heat if we make the current fixed and changed the voltage and resistance? Notice the flow of charge is constant
What are the consequences for a developed nation to not accept any refugees?
Why are co-factors 4 and 8 so popular when co-factor is more than one?
How do I explain that I don't want to maintain old projects?
Function that detects repetitions
3-way switches no longer serving their purpose
Is it possible for a character at any level to cast all 44 Cantrips in one week without Magic Items?
How to bind an object array to the view in ionic 4?
Safely turning a JSON string into an objectHow to horizontally center a <div>?How to change an element's class with JavaScript?How can I pretty-print JSON in a shell script?How do I test for an empty JavaScript object?How to check whether a checkbox is checked in jQuery?Convert form data to JavaScript object with jQueryHow to disable resizable property of textarea?How do I POST JSON data with Curl from a terminal/commandline to Test Spring REST?Can't bind to 'ngModel' since it isn't a known property of 'input'
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
I am learning to work with Ionic 4 framework. I got a hardcoded object array like this:
export interface List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
In my homepage.ts file I declared a variable like this:
newList: List = <List>;
And this is my code on the homepage.html
<ion-grid *ngFor="let f of newList.fields">
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value1</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value2</ion-input>
</ion-item>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value3</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value4</ion-input>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
When I start the app it doesn't show the values in the input fields. Also it doesn't log the object array. What am I doing wrong?
html json
angular typescript ionic-framework asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
add a comment |
I am learning to work with Ionic 4 framework. I got a hardcoded object array like this:
export interface List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
In my homepage.ts file I declared a variable like this:
newList: List = <List>;
And this is my code on the homepage.html
<ion-grid *ngFor="let f of newList.fields">
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value1</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value2</ion-input>
</ion-item>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value3</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value4</ion-input>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
When I start the app it doesn't show the values in the input fields. Also it doesn't log the object array. What am I doing wrong?
html json
angular typescript ionic-framework asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
add a comment |
I am learning to work with Ionic 4 framework. I got a hardcoded object array like this:
export interface List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
In my homepage.ts file I declared a variable like this:
newList: List = <List>;
And this is my code on the homepage.html
<ion-grid *ngFor="let f of newList.fields">
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value1</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value2</ion-input>
</ion-item>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value3</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value4</ion-input>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
When I start the app it doesn't show the values in the input fields. Also it doesn't log the object array. What am I doing wrong?
html json
angular typescript ionic-framework asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
I am learning to work with Ionic 4 framework. I got a hardcoded object array like this:
export interface List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
In my homepage.ts file I declared a variable like this:
newList: List = <List>;
And this is my code on the homepage.html
<ion-grid *ngFor="let f of newList.fields">
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value1</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value2</ion-input>
</ion-item>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-item>
<ion-input>f.value3</ion-input>
</ion-item>
</ion-col>
<ion-col>
<ion-item>
<ion-input>f.value4</ion-input>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
When I start the app it doesn't show the values in the input fields. Also it doesn't log the object array. What am I doing wrong?
html json
angular typescript ionic-framework html json
angular typescript ionic-framework asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
asked Mar 25 at 21:38
FearcoderFearcoder
2522 silver badges15 bronze badges
2522 silver badges15 bronze badges
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
You can't specify values in a TypeScript interface. You will need to make it a class.
export class List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
homepage.ts
newList: List = new List();
This will then allow you to iterate over the values in the new List object.
Simply casting your object will not add interface properties.
From TypeScript
A type assertion is like a type cast in other languages, but performs no special checking or restructuring of data. It has no runtime impact, and is used purely by the compiler.
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Did you create a newList using thenewkeyword?.newList: List = new List()
– Brady
Mar 25 at 22:58
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55346799%2fhow-to-bind-an-object-array-to-the-view-in-ionic-4%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can't specify values in a TypeScript interface. You will need to make it a class.
export class List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
homepage.ts
newList: List = new List();
This will then allow you to iterate over the values in the new List object.
Simply casting your object will not add interface properties.
From TypeScript
A type assertion is like a type cast in other languages, but performs no special checking or restructuring of data. It has no runtime impact, and is used purely by the compiler.
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Did you create a newList using thenewkeyword?.newList: List = new List()
– Brady
Mar 25 at 22:58
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
add a comment |
You can't specify values in a TypeScript interface. You will need to make it a class.
export class List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
homepage.ts
newList: List = new List();
This will then allow you to iterate over the values in the new List object.
Simply casting your object will not add interface properties.
From TypeScript
A type assertion is like a type cast in other languages, but performs no special checking or restructuring of data. It has no runtime impact, and is used purely by the compiler.
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Did you create a newList using thenewkeyword?.newList: List = new List()
– Brady
Mar 25 at 22:58
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
add a comment |
You can't specify values in a TypeScript interface. You will need to make it a class.
export class List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
homepage.ts
newList: List = new List();
This will then allow you to iterate over the values in the new List object.
Simply casting your object will not add interface properties.
From TypeScript
A type assertion is like a type cast in other languages, but performs no special checking or restructuring of data. It has no runtime impact, and is used purely by the compiler.
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
You can't specify values in a TypeScript interface. You will need to make it a class.
export class List
fields: [ value1: "Cat", value2: "Dog" , value3: "Rabbit", value4: "Horse" ]
homepage.ts
newList: List = new List();
This will then allow you to iterate over the values in the new List object.
Simply casting your object will not add interface properties.
From TypeScript
A type assertion is like a type cast in other languages, but performs no special checking or restructuring of data. It has no runtime impact, and is used purely by the compiler.
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
edited Mar 25 at 22:59
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
answered Mar 25 at 21:44
BradyBrady
865 bronze badges
865 bronze badges
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Did you create a newList using thenewkeyword?.newList: List = new List()
– Brady
Mar 25 at 22:58
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
add a comment |
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Did you create a newList using thenewkeyword?.newList: List = new List()
– Brady
Mar 25 at 22:58
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Thanks for your time! I changed the interface to class and the newList property. I still don't see the values.
– Fearcoder
Mar 25 at 22:03
Did you create a newList using the
new keyword?. newList: List = new List()– Brady
Mar 25 at 22:58
Did you create a newList using the
new keyword?. newList: List = new List()– Brady
Mar 25 at 22:58
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
Yes sir I have the right syntax that you wrote for me.
– Fearcoder
Mar 26 at 9:25
add a comment |
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55346799%2fhow-to-bind-an-object-array-to-the-view-in-ionic-4%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
