I am using Laravel 9, Jetstream, Inertia, Vue 3.
I have created an Api Resource for my Model Project
$projects = ProjectResource::collection(Project::get());
return Inertia::render('Project/Edit', compact('projects'));
In Vue, in the props "project" i get a nested array "data" and only the objects I need are already in it.
projects: Reactive
data:Array[2]
0:Object
1:Object
And it should be like this
projects:Reactive
0:Object
1:Object
I don't want to access props in vue via "projects.data"
I want it to be: "projects"
How to achieve this?
Taken from the official laravel docs (Data Wrapping)
By default, your outermost resource is wrapped in a data key when the resource response is converted to JSON.
In order to turn off this behaviour:
If you would like to disable the wrapping of the outermost resource, you should invoke the withoutWrapping method on the base Illuminate\Http\Resources\Json\JsonResource class.
So basically you need to run:
JsonResource::withoutWrapping();
In the boot method of your AppServiceProvider.
Related
I have a PASOE Business Class Entity setup as a Web Service. I'm trying to determine how to create a custom header that will allow me to pass in a hashed token. Is this something that I need to upgrade to 11.7.4 for DOH(OpenEdge.Web.DataObject.DataObjectHandler)? Or is this something that I simply add into a method that's defined in the class? Apologies, for the lack of code to illustrate my situation, but I'm not sure where to begin.
If you're using a Business Entity with the web transport then you're using the DOH, and the below applies. If you're using the rest transport then you are not using the DOH, and are more limited in your choices.
There is doc available on the DOH at https://documentation.progress.com/output/oe117sp/index.html#page/gssp4/openedge-data-object-handler.html - it's for 11.7.4 but largely applies to all versions (that is, from 11.6.3+). This describes the JSON mapping file, which you'll need to create an override to the default, generated one.
If you want to use the header's value for all operations, then you may want to use one of the DOH's events. There's an example of event handlers at https://github.com/PeterJudge-PSC/http_samples/blob/master/web_handler/data_object_handler/DOHEventHandler.cls ; you will need to start that handler in a session startup procedure using new DOHEventHandler() (the way that code is written is that it makes itself a singleton).
You can now add handling code for the Invoking event which fires before the business logic is run.
If you want to pass the header value into the business logic you will need to
Copy the generated mapping file <service>.gen to a <service.map> , in the same folder. "gen" files are generated and will be overwritten by the tooling
In the .map file, add a new arg entry. This must be in the same order as the parameters to the BE's method.
The JSON should look something like the below. this will read the value of the header and pass it as an input parameter into the method.
{ "ablName": "<parameter_name>",
"ablType": "CHARACTER",
"ioMode": "INPUT",
"msgElem": {"type": "HEADER", "name": "<http-header-name>"}
}
I am using Polymerfire library and a native javascript API in my project and I need to set up the production environment. I searched through multiple posts (for example this one) and I came to a conclusion that I need to create a separate project. However since I am using Polymerfire library I have my app name specified all over the project.
<firebase-auth id="auth" user="{{user}}" app-name="project-name" provider="password"
signed-in="{{signedIn}}"></firebase-auth>
To deploy in production it is required to change this name everywhere. I was thinking that I could create a computeAppName function which would return the app name according to the environment but I hope there is a better solution.
The same issue doesn't occur when I use the native javascript API because I am simply selecting the first app in the array (I'll never use multiple apps in my project).
Example
var actionCode = this.route.__queryParams["oobCode"],
auth = firebase.apps[0].auth();
In my opinion ideal, behavior would be if Polymerfire library automatically selected the only existing app in firebase.apps array. If that would be the case I could initialize one firebase-app element with app name in index.html and leave the app name unspecified deeper in the DOM tree.
This issue would be eliminated if I stopped using the Polymerfire library entirely but that would not follow the "Polymer way" of doing things.
Another option would be to create a task in a build system (like gulp) to replace the app name for production but that would be probably overly complicated.
What do you think?
Edit:
For now I am using a workaround:
firebase-app element in index.html:
<firebase-app id="main_app"
name="project-id"
api-key="key"
auth-domain="project-id.firebaseapp.com"
database-url="https://project-id.firebaseio.com"
storage-bucket="project-id.appspot.com">
</firebase-app>
In every element where Polymerfire is used I created a appName property which uses document selector to get the app name from element in the index:
appName: {
type: String,
value: function () {
return document.getElementById("main_app").name;
}
}
<firebase-auth id="auth" user="{{user}}" app-name="[[appName]]" provider="password"
signed-in="{{signedIn}}"></firebase-auth>
Thanks Jan
Name property of firebase-app element is only used as a name for the firebase app object, which can be arbitrary and there is no need to change it when switching to production project.
I am using angular2-meteor.
When I try to pass a value between two components (when the value change in the first component, create an event in second component and use this new value), I have two ways right now:
One way is meteor way: using this.autorun and Session.get.
Another way is angular2 way: using Injectable service with EventEmitter.
Which way should be prior? Or is there any other better way? Thanks
Now I used angular2-meteor a while.
Although the angular2-meteor tutorial has no example so far about using or choosing Angular 2 service or Meteor Session.
But I feel angular 2 takes the lead in the front end, while meteor makes reactivity easier and also handle all back end things.
So I went with angular2 way using service to share between components. And service is very powerful like #todd-w-crone said.
If anyone has better answer, I will switch to accept that one.
I find it practical to create a new service called App.states.ts which is accessed globally and mimics Session (get / set).
I commonly import this service to all necessary components to get or set new value such as User.status, company.profile, lastProduct, etc.
Since this service is #injectable it can also make use of other services, in case a value hasn't been set already.
This allows me to ask for a variable in a component appState.getLastModifiedItem(), then in app.states.ts I'll write this function to pass this.modifiedItem or either:
Request another service item.service.ts to fetch data
Call another function with itemCollection.findOne({...}) and return such value.
You can configure Mongo queries as you want and either store static data in appState or keep subscription items in appState.
Do take into consideration that all subscriptions handled by an #injectable within a component are imported by such component. Be wary of conflicting subscriptions between components/services.
I am new to the structure map but i want to use it in my asp.net site for dependency injection
can any one suggest me simple example to use structure map for the dependency injection
you will need to do something like this:-
StructureMapConfiguration
.ForRequestedType<IResourceA>()
.TheDefaultIsConcreteType<ResourceB>()
.CacheBy(InstanceScope.Singleton);
This tells StructureMap to inject ResourceB when there is a request for ResourceA.
Structure Map
You can configure programatically or via configuration file.
Programatical example (there are other ways):
StructureMap.StructureMapConfiguration.ForRequestedType<ISomething>().TheDefaultIsConcreteType<ConcreteSomething>();
then you can get an instance of the configured type using this sort of code:
//The concrete type will be ConcreteSomething
ISomething instance = ObjectFactory.GetInstance<ISomething>();
You can do it in a config file:
<StructureMap MementoStyle="Attribute">
<DefaultInstance PluginType="Blah.ISomething, Blah.SomethingDLL" PluggedType="Blah.Concrete.ConcreteSomething,Blah.ConcreteDLL"/>
</StructureMap>
and in the main method or Global.asax you can set this config by saying:
StructureMap.ObjectFactory.Initialize(x => { x.PullConfigurationFromAppConfig = true; });
and use it the same way as above:
ISomething instance = ObjectFactory.GetInstance<ISomething>();
If the concrete class has a constructor that needs instances injected in it, and you have those configured, the concrete types will get injected by the framework.
There are ways of passing parameters to constructors, dealing with Gereric types, creating named instances that are configured with specific constructor/property values. I use this framework and like it very much.
In my flex app there are a few custom components. I want to create instance of these components at runtime and assign them properties by reading in a config file.
I know how to read xml and instantiate components, however my question is about being able
to get the type of the component from the xml attribute and then creating an instance of that type.
My xml looks like this:
You can instantiate an arbitrary named type through ActionScript's "reflection API":
var clazz:Class = Class(getDefinitionByName("class.from.your.xml.file.Name"));
var component:Object = new clazz();
http://livedocs.adobe.com/flex/3/langref/flash/utils/package.html#getDefinitionByName()
If you get an error about the type not existing, this is because it isn't linked from elsewhere in your application and the compiler only adds classes that are referenced. You can work around this using the following compiler arg:
includes class [...]
Links one or more classes to the resulting application SWF file, whether or not those classes are required at compile time.
http://livedocs.adobe.com/flex/3/html/compilers_14.html#157203