Ngx-formly check for focus in expressionProperties - html

I am using ngx-formly v: 5.5.10. I try to check if field is focused in the expressionProperties.
This is necessary for changing the value based on focus. Something like this:
expressionProperties: {
'model.testField': (m) => {
if (m.testField.value && testField.focus=true) {
return x;
} else {
return y;
}
}
}
Is there a formly built-in solution for checking focus in the expressionProperties?
Thanks for any help!

The field instance is passed as a third argument of the expression callback:
expressionProperties: {
'model.testField': (m, formState, field) => {
if (m.testField.value && field.focus === true) {
return x;
} else {
return y;
}
}
}

Related

use directive return value

I have this dirctive that return title or null , how can i use this return value in html component ???
element:ElementRef;
#Input() pageTabTitle:string;
constructor(el:ElementRef) { this.element =el; }
ngOnChanges(): void {
setTimeout(() => {
this.hasTooltip(this.pageTabTitle);
})
}
hasTooltip(title:string) {
if(this.isOverflown()) {
return title;
} else {
return null;
}
}
isOverflown():boolean {
return this.element.nativeElement.scrollWidth >
this.element.nativeElement.clientWidth;
}
I want to use this value in tooltip title
[attr.data-original-title]="" // here I want to set return directive value
I think your directive doesn't have #Output - it couldn't return something:)
If you want that it emit some event with value, you should #Output property and emit it when you need.
Angular Io

Angular: Cannot retrieve function parameter value as an object property selector

I have an issue trying to retrieve a function parameter value as an object property selector into a .filter() method.
This is my code:
myFunction(property, value) {
function myFilter(obj) {
return obj.details.name == value;
}
return this._http.get(this.Url).map((response: Response) => response.json().filter(myFilter));
}
I want to replace return obj.details.name == value; by return obj.property == value;.
obj.property is the parameter of my function myFunction(property, value). The value parameter value works fine and is well retrieved.
This is what I want:
getFilteredFMsBy(property, value) {
function specificFilter(obj) {
return obj.property == value;
}
return this._http.get(this.Url).map((response: Response) => response.json().filter(specificFilter));
}
If I define the value of property in the function, same case. It doesn't work:
getFilteredFMsBy(property, value) {
property = "details.name";
function specificFilter(obj) {
return obj.property == value;
}
return this._http.get(this.Url).map((response: Response) => response.json().filter(specificFilter));
}
Any idea?
Seems like you need to access object[prop][prop2] given the object and the string "prop.prop2"
from this answer: Javascript: Get deep value from object by passing path to it as string you can do deepFind:
function deepFind(obj, path) {
var paths = path.split('.')
, current = obj
, i;
for (i = 0; i < paths.length; ++i) {
if (current[paths[i]] == undefined) {
return undefined;
} else {
current = current[paths[i]];
}
}
return current;
}
then do
getFilteredFMsBy(property, value) {
property = "details.name";
function specificFilter(obj) {
return deepFind(obj, property) == value; // <-- use it here
}
return this._http.get(this.Url).map((response: Response) => response.json().filter(specificFilter));
}
How about this?
getFilteredFMsBy(property: string, value:any) {
return this._http.get(this.Url).map((response: Response) => response.json().filter((obj) => { return obj[property] == value; }));
}

Compare answer from user and possible answer in array

My input text field has two possible answers which are "luah" or "hal" but my code is not working :
stop();
//var jawapan1=Array;
txt_zuhal.addEventListener(KeyboardEvent.KEY_DOWN,handler);
function handler(event:KeyboardEvent)
{
//jawapan1=("luah", "hal");
// if the key is ENTER
if(event.charCode == 13)
{
if(txt_zuhal.text == 'luah'||'hal')
{
trace("1.correct");
}
else
{
trace("1.Sorry, Wrong answer");
}
}
}
private function handler(event:KeyboardEvent):void
{
//jawapan1=("luah", "hal");
// if the key is ENTER
if(event.charCode == 13)
{
if(txt_zuhal.text == "luah" || txt_zuhal.text == "hal")
{
trace("1.correct");
}
else
{
trace("1.Sorry, Wrong answer");
}
}
}

How to change the mode dynamically in codemirror on encounter of a particular expression?

In the textarea whenever '<' is encountered the mode should be html and for '<#' or '<#' or '$', the mode should be ftl. In the code that I have written
function determineCodeMirrorType(cm) {
if (cm.getOption('mode') == 'text/ftl') {
checkAndSwitchToHTML(cm, cm.getValue());
} else if (cm.getOption('mode') == 'text/html') {
checkAndSwitchToFTL(cm, cm.getValue());
}
}
function checkAndSwitchToHTML(cm, val) {
if (/^\s*</.test(val)) {
cm.setOption("mode", "text/html");
}
}
function checkAndSwitchToFTL(cm, val) {
if (/[<#|<#|$]/.test(val)) {
cm.setOption("mode", "text/ftl");
}
}
function buildCMInstance(mode, value) {
var cm = CodeMirror.fromTextArea(document.getElementById("code"), {
mode:mode,
value:value,
lineNumbers:true,
onChange:function(cmInstance){
determineCodeMirrorType(cmInstance); //The call to this function is not made.
})
});
return cm;
}
$(document).ready(function(){
var cm = buildCMInstance("text/ftl")
});
I want to know is there any option that can be initiated which allows the code to change dynamically by making a call to the function "determineCodeMirrorType".
onChange does not exist in recent CodeMirror versions. You have to register the event handler by calling cm.on("change", function(cm, change) { .... }).

For each loop not looping through everything

I have a loop that runs in an onEnter function (bad i know). I only want it to run once but it doesnt loop through every object. I think it doesnt have time before the next frame runs. Any ideas on how to make it loop all the way?
private function onEnter(e: Event) {
if (deleteThis == true) {
if (timer == 0 || 1) {
if (checkExplosion == false) {
gotoAndStop(2)
if (Main.bloonList.length > 0) {
for each(Main.bloon in Main.bloonList) {
if (Main.areaOfCollision(Main.bloon, this, 0)) {
if (Main.bloon.currentFrame != 5) {
Main.money++;
Main.bloon.nextFrame();
Main.bloon.gotShot();
} else {
Main.money++;
Main.bloon.deleteBloon();
}
}
}
}
checkExplosion=true
}
}
}
}
Edit - deleteBloon();
public function deleteBloon()
{
this.parent.removeChild(this);
}
Firstly, this:
if (timer == 0 || 1)
Should be this:
if (timer == 0 || timer == 1)
Then you may need to change the code a little bit. Something like this could work. I do suspect your issue may actually lie in the deleteBloon function, though. Without seeing it I can't be sure, but there is nothing (technically) wrong with your for loop.
private function onEnter(e: Event) {
if (deleteThis == true) {
if (timer == 0 || timer == 1) {
if (checkExplosion == false) {
gotoAndStop(2);
if (Main.bloonList.length > 0) {
// This isn't optimised as I wasn't sure what Main.bloon could be
for each(var bloon:Main.bloon in Main.bloonList) {
if (Main.areaOfCollision(bloon, this, 0)) {
if (bloon.parent && bloon.currentFrame != 5) {
bloon.nextFrame();
bloon.gotShot();
} /*else {
// Make sure that deleteBloon is deleteing the correct array index. This is likely where the issue is.
bloon.deleteBloon();
}*/
Main.money++;
}
}
}
checkExplosion = true;
}
}
}
}
This would be in bloon:
import flash.utils.setTimeout;
function gotShot():void{
// second parameter is time in milliseconds before executing
setTimeout(deleteBloon, 250);
}