Stuck to understand angular array search - angularjs

see the code below.
i am new in angular. just do not understand this line
{{ (fields | filter : {fieldName:"houseNum"} : true)[0].fieldLabel}}
what is the meaning of true in bracket if we specify false like ({{ (fields | filter : {fieldName:"houseNum"} : false)[0].fieldLabel}}) then what will happen ?
Full code
<div ng-app="app" ng-controller="ctrl">
{{ (fields | filter : {fieldName:"houseNum"} : true)[0].fieldLabel}}
</div>
angular.module('app', []).controller('ctrl', function($scope) {
$scope.fields = [{
fieldName: 'houseNum',
fieldLabel: 'House Number',
disabled: false
}, {
fieldName: 'street',
fieldLabel: 'Street',
disabled: false
}, {
fieldName: 'city',
fieldLabel: 'City',
disabled: true
}, {
fieldName: 'state',
fieldLabel: 'State',
disabled: true
}, ]
})
sample taken from https://jsfiddle.net/tridip/q2r3cogj/

According to the AngularJS documentation:
Comparator which is used in determining if values retrieved using expression
(when it is not a function) should be considered a match based on the the
expected value (from the filter expression) and actual value (from the object
in the array).
Can be one of:
function(actual, expected): The function will be given the object value and
the predicate value to compare and should return true if both values should be
considered equal.
true: A shorthand for function(actual, expected) { return
angular.equals(actual, expected)}. This is essentially strict comparison of
expected and actual.
false: A short hand for a function which will look for a substring match in a
case insensitive way. Primitive values are converted to strings. Objects are
not compared against primitives, unless they have a custom toString method
(e.g. Date objects).
Defaults to false.
So setting it to true requires an exact match for the item to be shown. A false setting will allow for partial matches, case insensitive matches, etc.

Related

Searching for a boolean type field from mongo via angular formly

I got to implement a simple search (or it was that to my mind), the field I'm searching for is called "paymentStatus" on an Invoice and it's basically a boolean value in a mongo db (v3.4). The search comes from angular-formly input field (angularJS 1.6), and I can see it logged quite easily , as "paymentStatus - true", and "paymentStatus-false" when I send the info to search for -
{ paymentStatus: true }
Formly field looks like this -
{
key: 'paymentStatus',
type: 'horizontal-ui-select',
className: 'tooltipLabel',
templateOptions: {
optionsAttr: 'bs-options',
ngOptions: 'option[to.valueProp] as option in to.options | filter: $select.search',
label: $filter('translate')('Payment Status'),
placeholder: $filter('translate')('Payment Status'),
valueProp: 'paymentStatus',
labelProp: 'name',
searchable: true,
tooltipClass: 'wide-tooltip',
options: [
{"paymentStatus": true, "name": 'Paid'},
{"paymentStatus": false, "name": 'Unpaid'},
]
}
},
In the controller for backend to fill up the table with data to be displayed (which works correctly),
I have additional code for search filter which is like this -
if (where.paymentStatus && where.paymentStatus !== null && where.paymentStatus !== undefined) {
mongoQuery[0].$match["$and"].push({"paymentStatus": {$in: where.paymentStatus}});
}
I tried playing with $eq instead of $in and basic true false toggles instead of "where.paymentStatus" which give me half result half the time. "where" is from request.allParams().data.where. I'm a beginner with DB work/searches, especially with mongo and angular JS formly. It's legacy code that's sparsely documented. Thanks for all the help.
Never mind, where.paymentStatus annuled my querying for false status. Replaced $in with $eq also. Works properly now.

Schemaform hide field **value** if it equals to X

i have a form that is being loaded with the use of schema-form, in that form i have a field MaxCardshis value is the value from db, and it can be null in the server-side i transformed null to -1
MaxCards = domainColumn.MaxCards.HasValue ? domainColumn.MaxCards.Value : -1
When the value -1 is loaded i dont want to show it in the form UI, instead i want to show an empty string.
How can I achieve it?
this is how i load the form: (Key: MaxCards is the field that i am talking about)
vm.form = [{
key: 'Name',
readonly: false
}, {
key: 'MaxCards',
readonly: false,
fieldHtmlClass: "editColumnModel-maxCards"
}, {
key: 'Description',
readonly: false,
type: 'textarea'
}];
You can try, replacing your -1 values, though I would suggest you to return blank space from your service/controller instead of -1 (null) if the type safety is not a concern.
{{ domainColumn.MaxCards.Value.replace('-1', ' ') }}
Or
$scope.domainColumn.MaxCards.Value.replace('-1', ' ');
I have not tested this nor I am sure what values your code returns, so please feel free to tweak this code a little.

Filters with two properties in extjs

I need to create a filter that has two properties or operators.
I need to filter the Type AND the Number to put in combobox. The data are shown in the same table in the database. In this filter below I can just filter the number, it ignores the type.
Does anyone know if there is any way to do? Thanks.
filters: [
{
property: 'type',
operator: '=',
value: 'recorder'
},
{
property: 'number',
operator: '=',
value: '{number.value}'
}
Without knowing the type of data you want to filter, it's hard to say why the type fiilter is not working. On a first glance, the filter config looks fine.
However, if the filter config won't work for any reason, you can also pass in a function for filtering:
filters: [
function(item) {
return item.get('type') == 'recorder';
},
{
property: 'number',
operator: '=',
value: '{number.value}'
}
]
Using a function also has the advantage, that you can set a break point and check which value is actually validated.

Angular Formly - Highlight field based on custom validation

Currently, I have a formly field set up as such:
{
key: 'id',
type: 'input',
validators: {
validId: function($viewValue, $modelValue, scope){
var value = $modelValue || $viewValue;
if(value){
return isAlphanumeric(value);
}else{
return false;
}
}
},
templateOptions: {
label: 'ID',
options: [],
required: true
}
},
isAlphanumeric() is a function I wrote that determines if a string is alphanumeric--this works as intended. However, the user is still allowed to Submit the form (which obviously does not work, as it will produce en error).
How might I go about highlighting the field red (as if it were a required field that was not filled in) if the contents are not valid, preventing the user from submitting until they enter a valid value?
You can use ngClass and assign css classes based off of an expresion. for example (taken straight from their page)
<p ng-class="{strike: deleted, bold: important, 'has-error': error}">Map Syntax Example</p>
implemented with your code
<p ng-class="{strike: validId(1,2,yourscope), bold: important, 'has-error': error}">Map Syntax Example</p>

Angular - Filter based on nested array boolean

I'm trying to find a good way to filter on click, based on a boolean value that's within a nested array.
My current scope looks like the following
$scope.persons = [
{
firstName : 'Drew',
lastName : 'Minns',
views : [
{
name : 'View 1',
support : true
},
{
name : 'View 2',
support : false
}
],
},
{
firstName : 'Peter',
lastName : 'Parker',
views : [
{
name : 'View 1',
support : false
},
{
name : 'View 2',
support : false
}
],
}
];
I'm looking to add a filter that sorts based on the boolean value of each view object. The problem that I'm running into is that I can't access that value without iterating over every array. Doing that is making it tough to access each individual value without referencing the array number.
I want to hide the parent object based on whether or not the specific "view" object has a true or false in the support field.
Again, I'm looking to do this on click, so the idea is that you click a button for 'View 1' and only those parent objects with true value for support shows up. There will be multiple buttons for each "view" so I'm looking to provide the action of drilling down based on support for views.
Here's a plunkr http://plnkr.co/edit/ipi8vKEbxps2H89HTg00?p=preview
You can use Angular JS's "Filter" function to do this. Plunkr example, with the relevant change below
http://plnkr.co/edit/LHTpRqHbTxEAslY0rd5J?p=preview
<ul ng-repeat="view in person.views | filter:{ support: true }">
Edit: For what you want, I've slapped together a quick custom filter: http://plnkr.co/edit/LHTpRqHbTxEAslY0rd5J?p=preview

Resources