String passed to Angular2 Component is always undefined - javascript

When I'm passing a string to an #Input() of the Component, it is always undefined.
This is where I loop trough my array and pass the string to the component
https://github.com/davidhoeck/ng2-realtime-chat/blob/master/src/client/app/%2Bmessaging-page/messaging-page.component.html
And thats my component where I'm trying to get the value from the string passed trough.
https://github.com/davidhoeck/ng2-realtime-chat/blob/master/src/client/app/chat-window-component/chat-window-component.component.ts
Would be great if somebody could solve my problem.

The issue is with the way you are sending the string. "default" gets evaluated as a variable, and since it's not present in the controller it will evaluate to undefined.
Instead add use single quotes to denote a string in a template.
<chat-window [groupid]="'default'"></chat-window>
You can see the issue in this small plunker example.

Related

why vue props decoding JSON strigifyed object

I am passing a stringifyed object via props to a component like below.
<my-component :filter="stringobject" ></my-component>
stringobject = "{"search_text":"(ciClass like '%5684%') AND status NOT IN ('Terminated','Closed','Implemented')"}"
Inside "my-component" when I receive the filter prop, the query is being changed to
ciClass like 'v84%'
Somehow vue is converting the '%56' to 'v'. In my-component the type of the prop is String.
I tried to escape it with backslash, storing the string in variable first, tried using encoded chars instead of quotes but it didn't work. Any idea what might be going wrong here?
In my stringifyed object, I repalced % with %25 and it started working! I am not very sure how and why this decoding was taking place.

Passing values outside of array in .map - React

I am working with this piece of code in React where I am mapping over the array "householdNotes", passing "nt" to each component being created. "staffUser" is a hook/variable being stored elsewhere in the code. I would like to pass this value down to the components as a prop. Is this possible in any way?
householdNotes.map(nt => <NoteCard note={nt} user={staffUser} />
)
An option I thought about was passing it through the slug and then grabbing it from match.params, but I'd like to avoid that if possible because staffUser can contain spaces. I don't mind passing the static value of "staffUser" if that also makes this doable. Any ideas?
Thanks for your help, friends!

How do I access the 'str' value in my object?

I am trying to return the value under the key 'str' in an Object but I am having trouble accessing the value.
This is what is returned in the console:
Currently I am using a map function to go over the array and just return the _str value like so:
let idx = currentArray.map(function(x) {
return x._id._str;
});
However it is still returning the value as an object. How can I get just the value of the _str key?
Here is the full array without specifying the id field. This is what is returned if you jsut return 'x' in the map function.
You've clarified that the screenshot is of x._id. So to access _str, you'd use x._id[0]._str: The _str property is in the object referenced by the 0 property (the first entry in the array x._id refers to).
Note that in general, _-prefixed properties are meant not to be accessed by code outside the code responsible for the objects in question. You don't seem to be responsible for them, so accessing those properties is likely to make your code rely on undocumented properties that may change in the next "dot" release of whatever lib you're using. It's just convention, but it's a very common convention.
If you right click on the property, most browser consoles offer the ability to copy property path.
Based on this SO post and the docs, it appears that you can probably use x._id.str.
If I understand correctly, you are receiving the str value but it is an object instead of the string literal. In other words, you are getting _str: "598..." instead of "598....". A possible solution would be to use the mongo javascript function to convert the str value to a string.
In your case, I think something like return x._id.str; may work as _id is a MongoID.ObjectID.
I've also linked the documentation below for reference.
https://docs.mongodb.com/manual/reference/method/ObjectId/
Here's a relevant SO answer as well: Convert ObjectID (Mongodb) to String in JavaScript
I think you should write x[_id]._str because _id is one of the array objects.

String Interpolation in React component with strings returned from server

I currently have strings being returned from a server which have variables that need to be interpolated on the front end. I'm using React and Redux and set the strings to the component's props so that they are accessed as follows:
this.props.translations['hello-message']
An example string looks like:
Hello, ${name}!
In addition, I have the user's name being returned from the server and set to props as well. How can I interpolate the string so that the user's name appears in the string and thus in the rendered React component.
I've tried use the String.prototype.replace() method in the render of the React component as follows:
let helloMessage = this.props.translations['hello-message'].replace('${name}', 'Joe');
But this returns an error of: "Uncaught TypeError: Cannot read property 'replace' of undefined". I've tried various other strategies such as functions inside componentWillReceiveProps() or creating a helper function as mentioned here: How can I construct a Template String from a regular string? all to no avail.
That error message means that this.props.translations['hello-message'] does not contain the value you think it does. This is likely a react issue, where your code is calling this section multiple times while it pulls data from the Redux store, and on the first call that var is not yet initialized.
As a very simple solution, try wrapping that statement with a check to see if the variable exists yet;
let helloMessage = '';
if(this.props.translations['hello-message']){
helloMessage = this.props.translations['hello-message'].replace('${name}', 'Joe');
}

Check passed data with a view is not empty in laravel

I am using laravel 4 and I want to pass a data with a view.
I have used this code in a controller.
$view = View::make('settings.editEvent');
$view->bounderyData = $bounderyData;
And I want to check whether this data exists or not in the view settings/editEvent.blade.php
Tried using this..
<script>
if('{{$bounderyData.length()}}'!=null)
console.log('exists');
</script>
Error :
Array to string conversion error
How can I check the existence ?
Do not assign the data to the View variable, but instead, pass it along using with as Laravel requests you to use:
$view = View::make('settings.editEvent')
->with('bounderyData', $bouderyData);
Actually both of the snippets work the same way. You can either pass data using with() method or by assigning it to view as property. So it doesn't really matter. But it looks like you are using some weird syntax because you are trying to access method length() using dot syntax inside Blade echo statement. Try:
if({{count($bounderyData)}}!=null)
console.log('exists');
or something similar. Remember that everything inside {{}} is going to be echo'ed by PHP. So if you have some sort of array there you may either want to count number of elements or maybe cast it to JSON and then decode it inside Javascript. If you still have problem, let us know what is the issue.

Categories