I am working on a save feature using angularjs, web api and entity frame work. When the user clicks add new button I initialize some fields to default values. I have an itemDetail object and an itemPrice object. Both have an itemNo field. On the form itemDetail is updated by the ng-model. How can I also get that value in the newItemPrice()?
HTML:
<input type="text" name="itemNo" class="form-control" id="itemNumber" ng-model="vm.item.itemDetail.itemNo" />
Controller
function newItemDetail() {
return {
id: 0,
itemId: 0,
itemNo:'',
onHandQty: 0,
storeListPrice: 5000.00,
inventoried: false,
}
}
function newItemPrice() {
return {
id: 0,
itemId: 0,
itemNo: '',
country: 'USA',
region: 1,
discountPercent: 10,
erpDeleted: false,
deleteRemote: false,
}
}
You can use the ng-change directive:
ng-change="vm.item.itemPrice.itemNo = vm.item.itemDetail.itemNo"
Look here:
How to bind 2 models to one input field in Angular?
Else i would recommend you to change the data structure from 2 objects with IDs into 1 object with 2 propertys.
function Item() {
return {
id: 0,
itemId: 0,
itemNo: '',
price: {
onHandQty: 0,
storeListPrice: 5000.00,
inventoried: false
},
detail:{
country: 'USA',
region: 1,
discountPercent: 10,
erpDeleted: false,
deleteRemote: false}
}
}
it seems that you add a comma at the last key/value pairs in your objects I would recommend to remove them i had some wild bughunting them sometimes
Related
I have a sample response which I received, the structure is something like this:
A = [{ user:
{ score_level: 16,
is_system: false,
location: 'Mumbai',
email: 'abc#xyz.org',
image: 'example.org',
firstname: Steve},
details: { solution_count: 1, average_rating: 1, recommendation_count: 0 },
score: 45},
{ user:
{ score_level: 17,
is_system: false,
location: 'Miami',
email: 'ab.org',
image: 'example.net',
firstname: Mark},
details: { solution_count: 1, average_rating: 1, recommendation_count: 0 },
score: 50}]
We are getting some information about the user, so what I would like to do is to get only the fistname for every user from this file.
I tried using:
var read = JSON.parse(A);
var firstname = read["user"]["firstname"];
But this dosent seem to work, can you suggest a solution for this?
You can map through the array of objects, check if the object is a user object, and if so, return the firstname. This will yield an array of firstname values.
const names = A.map((obj) => {
if (obj.user) {
return obj.user.firstname;
}
});
I started to work with ui-grid a few time ago so i'm having some problems.
I would like to filter the options in dropdown of every row of the grid.
I can filter the values and show it in the dropdown field but when i click in dropdown only appear undefined values. What can i do to solve this problem?
I've tried so many things but i can't find the solution.
Here is the plunker
http://embed.plnkr.co/HMsq4OasNs50ywJuI3DS/
Thanks
I forked your plunker.
In summary, I changed up the column definition to use editDropdownOptionsFunction instead of the combination of editDropdownOptionsArray and cellFilter. According to the documentation,
cellFilter is a filter to apply to the content of each cell
... so that doesn't seem like what you were trying to achieve.
Also, changed the periodos definition for rowEntity.sindicato === 1 to be an array rather than an object.
editDropdownOptionsFunction: function(rowEntity, colDef) {
console.log(rowEntity);
if (rowEntity.sindicato === 1) {
periodos = [{
id: 1,
value: 'teste1'
}];
} else if (rowEntity.sindicato === 2) {
periodos = [{
id: 2,
value: 'test2'
}, {
id: 5,
value: 'test5'
}];
} else {
periodos = [{
id: 3,
value: 'test3'
}, {
id: 6,
value: 'test6'
}, {
id: 4,
value: 'test4'
}];
}
return periodos;
}
I am newbie to AngularJS. I want array of objects name, selected and count like this at run-time :
$scope.filenames = [
{ name: 'abc', selected: false , count: 10},
{ name: 'ede', selected: false, count: 5},
{ name: 'xyz', selected: false, count: 2 },
{ name: 'pqe', selected: false, count: 8 }
];
So I have created restangular service that fetch the values of name, count and selected on runtime. The code to get runtime those values are :
//initialize the arrays
$scope.filenames=[];
$scope.filenames.count=[];
$scope.filenames.name=[];
$scope.filenames.selected=[];
//called rest service that fetch the names of all files
Restangular.one("getAllFiles").get().then(function(listAllFiles){
for(i=0;i<listAllFiles.length;i++){
var fileName=listAllFiles[i];
//then called another rest service that return the file name along with the count like abc=2
var parameter="getFileCount/fileName;
Restangular.one(parameter).get().then(function(countAndFileName){
var spilitFileCount=countAndFileName.split("myspiliter");
$scope.filenames.name.push(spilitFileCount[0]);
$scope.filenames.selected.push(false);
$scope.filenames.count.push(spilitFileCount[1]);
});
}
});
I am able to get count and file names successfully. I want all them to put in $scope.filenames array. So that I can use this array on my html page :
Html Code to display file name along with count is :
<div class="form-group" id="filename" style="display:none;">
<label class="col-sm-8 control-label" ng-repeat="filename in filenames">
<input
type="checkbox"
name="myName[]"
value="{{filenames.name}}"
ng-model="filenames.selected"
ng-click="toggleSelection(filename.name)"
> {{filename.name}} ({{filename.count}})
</label>
</div>
But I am unable to put the values into array $scope.filenames and use it at HTML view. If I am accessing the values of $scope.filenames outside of the outer rest service, then it has nothing at all. Where I am missing the things ?
Your code doesn't match at all with what you want. What you want is:
$scope.filenames = [
{ name: 'abc', selected: false, count: 10},
{ name: 'ede', selected: false, count: 5},
{ name: 'xyz', selected: false, count: 2},
{ name: 'pqe', selected: false, count: 8}
];
This is a single array, containing objects.
But your code does the following:
$scope.filenames = [];
$scope.filenames.count=[];
$scope.filenames.name=[];
$scope.filenames.selected=[];
This creates 4 arrays.
What you want is
$scope.filenames = [];
And you want to push objects with 3 properties in this array:
var spilitFileCount = countAndFileName.split("myspiliter");
var object = {
name: spilitFileCount[0],
selected: false,
count: spilitFileCount[1]
};
$scope.filenames.push(object);
Your ng-repeat body is wrong as well:
<label class="col-sm-8 control-label" ng-repeat="filename in filenames">
The above means: iterate over the array filenames; at each iteration, the current element is accessible using the variable filename.
So it should not be
value="{{filenames.name}}"
ng-model="filenames.selected"
but
value="{{filename.name}}"
ng-model="filename.selected"
I'm binding a select element to data that looks like this:
var gearConditions = [
{ id: 1, value: 'New' },
{ id: 2, value: 'Like New' },
{ id: 3, value: 'Excellent' },
{ id: 4, value: 'Good' },
{ id: 5, value: 'Fair' },
{ id: 6, value: 'Very Used' },
{ id: 7, value: 'Other' }
];
My select looks like this:
<select name="condition"
class="form-control"
ng-model="postModel.condition"
ng-options="condition.id as condition.value for condition in gearConditions">
</select>
This binds condition.id to the ng-model and displays condition.value as the select option. My question is: can I keep the current behavior but bind the whole object to the ng-model?
For example if the first option is selected the model value would then be {id:1, value: 'New'} rather than just 1.
Is this possible or do I need to use ng-changed to accomplish this?
Thanks!
Yes, change condition.id to condition:
ng-options="condition as condition.value for condition in gearConditions"
I think you you try similar:
// I took this from my code
ng-options="key as value for (key, value) in ...
Now you could try to combine key+value and see if it appears like you wish.
I have a <select> that I am populating with a list of values. Everything works and I see the expected list. But now I would like to have the value set to a locally stored value if available.
I have the code below. When I run this code the number after the Type in the label changes to match that in the localstorage but the select box does not change.
getContentTypeSelect: function ($scope) {
entityService.getEntities('ContentType')
.then(function (result) {
$scope.option.contentTypes = result;
$scope.option.contentTypesPlus = [{ id: 0, name: '*' }].concat(result);
$scope.option.selectedContentType
= localStorageService.get('selectedContentType');
}, function (result) {
alert("Error: No data returned");
});
},
<span class="label">Type {{ option.selectedContentType }}</span>
<select
data-ng-disabled="!option.selectedSubject"
data-ng-model="option.selectedContentType"
data-ng-options="item.id as item.name for item in option.contentTypesPlus">
<option style="display: none" value="">Select Content Type</option>
</select>
Here is the code I have that sets the value in localstorage:
$scope.$watch('option.selectedContentType', function () {
if ($scope.option.selectedContentType != null) {
localStorageService.add('selectedContentType',
$scope.option.selectedContentType);
$scope.grid.data = null;
$scope.grid.selected = false;
}
});
Here is the data stored in contentTypesPlus:
0: Object
id: 0
name: "*"
__proto__: Object
1: b
id: 1
name: "Page"
__proto__: b
2: b
id: 2
name: "Menu"
__proto__: b
3: b
id: 3
name: "Content Block"
__proto__: b
How can I make the select box go to the localstorage value if there is one?
Update
Still hoping for an answer and I would be happy to accept another if some person can help me. The answer given is not complete and I am still waiting for more information. I am hoping someone can give me an example that fits with my code. Thanks
I think you need to make sure selectedContentType needs to be the id field of the option object according to the comprehension expression defined in the select directive.
The comprehensive expression is defined as
item.id as item.name for item in option.contentTypesPlus
item.id will be the actual value stored in the ng-model option.selectedContentType
Say this is your select with ng-model
<select
ng-model="language.selected"
ng-init="language.selected = settings.language[settings.language.selected.id]"
ng-options="l.label for l in settings.language"
ng-change="updateLanguage(language.selected)">
In your controller
$scope.settings = {
enableEventsNotification: true,
enableiBeaconNotification: true,
hours: [
{ id: 0, label: '3h', value: 3 },
{ id: 1, label: '6h', value: 6 },
{ id: 2, label: '9h', value: 9 },
{ id: 3, label: '12h', value: 12 },
{ id: 4, label: '24h', value: 24 }
],
language: [
{ id: 0, label: 'English', value: 'en-us' },
{ id: 1, label: 'Francais', value: 'fr-fr' }
]
};
$scope.hours = [];
$scope.hours.selected = $localstorage.getObject('hours', $scope.settings.hours[1]);
$scope.settings.hours.selected = $localstorage.getObject('hours', $scope.settings.hours[1]);
$scope.hours.selected = $scope.hours.selected;