Angular app can't find controller on transclude - html

I am unable to get my controller linked to my view. If I include the view using ng-view and have the controller name in the route, the transclusion fails in Angular-route.js when it trys to link in the ngViewFillContentFactory. If I use the ng-controller attribute in the view itself, it fails in angular.js on the boundTranscludeFn that binds the controller to the view. In both cases I can see the application and the 'shell' controller are loaded into the DOM. In both cases the error message "Argument 'shell' is not a function".
The ng-app tag is set in the html tag to the name of the application. Why can the application not find the controller? What tiny little detail am I missing?
Here is the error message (I am calling the controller on two different divs) and here is the controller function loaded into the angular controllers collection.
The ng_app attribute is set to "cockpit" in the html tag and in both cases now I am using the router to assign the shell controller to both the view and the ng-included partial. The same thing happens if I assign the ng-attribute tag to "shell" in shell.html only the error occurs in another part of the code.
I am trying to put together a test app to reproduce the problem which I can post on git.

So the problem was how I was constructing my module. I can't tell you exactly what I did wrong because I don't yet understand exactly how modules work. What I did was to reduce the application down until I got it to work and added things back one by one until I found the thing that broke the app.

Related

Thymeleaf Fragments: How to pass String to Fragment to be used as onchange method

I am having an issue with the relationship between my Thymeleaf content file and fragment file that it uses. From the content file, I am passing many parameters to the fragment that are successfully rendered. However, one parameter that isn't working is a string that I'm passing that is to be used as an onchange method. The error I'm getting is that Method call: theMethod() cannot be found... Here is a simplified snippet of the content file that I'll call content.html:
<div>
<span th:replace="inputs::myInput('idExample', 'theMethod()')"></span>
</div>
And then here is the simplified snippet of the fragment file that I'll call fragment.html:
<span th:fragment="myInput(id, onchange)">
<select th:id="${id}" th:onchange="${__${onchange}__}">
...
...
...
</select>
</span>
Now, theMethod() is defined in a .js file that I have tried including directly as a src in both the content.html and fragment.html files, and it still gives the same error that the method call can't be found. And even if I directly define a theMethod() function in content.html and/or fragment.html, it STILL gives the same error. So I'm thinking maybe the structure of what I have in the th:onchange could be incorrect but not sure. For example maybe the ${__${}__} structure is wrong because I'm not that familiar with the detailed Thymeleaf syntaxes out there.
${__${onchange}__} is trying to run ${theMethod()} as Thymeleaf code -- which is having the Thymeleaf interpreter try to run the java function theMethod().
That being said, if you change it to th:onchange="${onchange}", you probably ran into the error Only variable expressions returning numbers or booleans are allowed in this context, any other datatypes are not trusted in the context of this expression
Thymeleaf really doesn't want you try and build JavaScript expressions and output them in html attributes because of the security vulnerabilities that can happen because of this. They typical way to solve problems like these is to pass function arguments to th:data-* attributes and then have hardcoded JavaScript like this:
<select th:data-id="${id}" th:data-name="${name}" onchange="onChange(this.getAttribute('id'), this.getAttribute('name'))">
That may or may not be directly applicable here -- so there is no easy way to solve your problem without restructuring the way you are handling onChange events.

MvvmCross 4 support for UWP, AppShell missing Frame

I have created a new solution for my MvvmCross app that supported Windows Store and I want to support UWP on Windows 10. I have moved over the PCL successfully, but I am having problems getting the basic UWP app working using a sample provided by MS (NavigationMenu) which uses the SplitView and the AppShell pattern they are recommending for the new navigation/command model. I referenced a helpful blog post (http://stephanvs.com/implementing-a-multi-region-presenter-for-windows-10-uwp-and-mvvmcross/), which gave me some guidance on how to integrate mvvmcross into the AppShell, but startup is failing because the AppShell does not have a valid Frame defined. Frame is a read-only property, and I have been unable to see where this is being set up.
I am using the standard AppShell implementation from the NavigationMenu with the following changes as recommended in the blog post:
public sealed partial class AppShell : MvxWindowsPage // was Page
public Frame AppFrame { get { return this.Frame; } } // was this.frame
Except for code after the error, there are no differences in the setup. In looking at the MvxWindowsPage implementation, there doesn't seem to be anything special as it still invokes the Page initialization. Is there something obvious I am missing?
So the link to the blogpost is correct, in other words you'll need to use MultiRegions from MvvmCross to get this working.
But what the blogpost doesn't show is a complete working version...
I've added one on my github here:
https://github.com/Depechie/MvvmCrossUWPSplitView
Some pointers to take away, like I said in the comments.
Your view where the SplitView will be present, needs to have a property to return a valid Frame to look for while injecting new views. This can be returned like this return (Frame)this.WrappedFrame.UnderlyingControl; found in the code here https://github.com/Depechie/MvvmCrossUWPSplitView/blob/master/MvvmCrossUWP.Win/Views/FirstView.xaml.cs#L13
Than all views you want to load up in the SplitView will need to reference to the region you defined in that SplitView, in my case I named it FrameContent as seen here https://github.com/Depechie/MvvmCrossUWPSplitView/blob/master/MvvmCrossUWP.Win/Views/FirstView.xaml#L48
So use that name for the region attribute in all to be loaded views like so [MvxRegion("FrameContent")] example here https://github.com/Depechie/MvvmCrossUWPSplitView/blob/master/MvvmCrossUWP.Win/Views/SecondView.xaml.cs#L7
I see what you're trying to do with the SplitView template that's provided by Microsoft. There is however a mismatch between things managed by MvvmCross and UWP.
By default MvvmCross maps ViewModels to Views based on naming conventions. What you are trying to do is use a view 'AppShell' (which is derived of Windows.UI.Xaml.Controls.Page) that doesn't adhere to the default MvvmCross convention.
The way I choose to implement this SplitView (Hamburger) functionality is by deleting the provided AppShell class entirely. I then created a new view named HomeView (since I have a ViewModel with the name HomeViewModel) and added the SplitView control there as described in the post you mentioned above.
For completeness I've created a Gist with the App.xaml.cs and HomeView.xaml as you requested. You can find them here: https://gist.github.com/Stephanvs/7bb2cdc9dbf15cb7a90f

Grails JSON Marshalling Works after first running compile

I'm experiencing a discrepancy between the first compilation of a Grails app and the compilation that happens when a file changes while the app is running.
Background:
My app creates some spring beans from Spring LDAP (docs) using conf/spring/resources.groovy.
I have an LdapUser.groovy class in src/groovy (I'm using it similarly to a domain class, except it isn't in grails-app/domain as it doesn't map to a database table).
In BootStrap.groovy I register a JSON marshaller for LdapUser (using JSON.registerObjectMarshaller).
I have a controller with an index method that responds a list of LdapUser objects. This renders correctly in JSON (according to the marshaller).
With that background, here are the pieces of the problem:
When the show method, which responds a single LdapUser, gets called, I get an exception that LdapUser cannot be converted to grails.converters.JSON. (fair enough)
But, if I save the LdapUser.groovy file, thus invoking a recompile on the file while the app is running, the JSON marshaller suddenly works fine.
Before saving the LdapUser.groovy, my controller has a to an LdapUserRepo (a class instantiated via an #EnableLdapRepositories annotation on the controller), but this reference becomes null after I save LdapUser.groovy. I'm not sure how this relates to the problem, as I was also able to reproduce the problem in a controller lacking an injected LdapUserRepo (but with the annotated controllers still in the app).
I also at one point was setting an asType method on the LdapUser class, which was called as expected before the save-invoked recompile. After the recompile, however, my asType method was no longer called and the JSON marshaller was taking over. ( I was doing exception-worthy things in the asType that were throwing before recompile and not throwing after... )
My understanding of the problem is therefore:
Somehow the asType method of the LdapUser.groovy class is not being automatically generated on first compile when running the app, but is being generated on subsequent compiles.
The LdapUser class is tied to the LdapUserRepo in more ways than merely being a type the Repo uses, and the recompile is not reflecting that connection correctly.
Methods rendering lists of objects are somehow unaffected by the asType method. This leads me to believe that the JSON marshaller gets called directly on list elements (instead of via asType) when the list asType has been called (whether or not the "as" operation is implicit...).
My question then is:
what is the Grails compiler doing differently on run-app vs on compile while app is running that could be causing this behavior?
how can I restructure things to ensure it works properly out of the box?
If I need to RTFM, what would be the FM section? (My google-fu is sadly quite weak).
Note: this question is vaguely similar, but doesn't have any meaningfulness to the answer:
Grails: Defining a JSON custom marshaller as static method in domain

Angular - building a "public" function (newbie)

I'm After several days learning angularJS through converting my standart JS app to a ng one.
I was wondering about this simple scenario:
I have a global function called fb_connect(),
it can be used from any page (or any controller if you like) to make a facebook-based login.
This function makes a simple http call and receives a JSON object contain data to move on (display a pop up, login, etc...)
I read that I can define a Factory or a Service for my app and use it in any controller, which works fine.
So, I created a fb_connect factory function.
The problem is that now, in every page (every controller), I have to define that fb_connect in the constructor of every controller - for example :
function welcome($scope,fb_connect){});
What is the proper way to do this kind of actions using Angular without having to define these functions each and every time in every controller?
Thanks
Setting up factories and services is all part of the dependency injection system of Angular. Using that system is great when you need to create things that depend on other injected things. It's a big tree of dependencies. It's also nice for creating singletons, such that everywhere in your code end up using the same instance of some object.
It sounds to me like neither of these benefits apply in your case. I'd suggest just not using Angular's DI for it. You have some function defined globally, just call it directly and skip the DI. There's nothing wrong with that.
Of course you say it makes an Ajax call, so doesn't depend on the Angular $http service?
Your two options are:
Declare the function on the $rootScope
Inject it as a service
My advice is to go with making it a service. The whole purpose of services is explained in the Angular.js docs, just like this quote:
Angular services are singletons that carry out specific tasks common to web apps... To use an Angular service, you identify it as a dependency for the dependent (a controller, or another service) that depends on the service.
As you mentioned in your question, you'd prefer to not define the service in every controller you wish to use it in. With $rootScope you'll be injecting that also in every controller. So really it's a question of which you prefer, although to answer your question, the proper way of using a factory or service is to inject it into the controller you wish to use it in.
You can always put it in the $rootScope
myApp.run(function($rootScope, fb_connect){
$rootScope.welcome = function(){
};
});

Call a controller inside a template and another controller in Fatfree framework

i'd like to know if i can call a controller action inside a template, and inside another controller in fatFree framework (F3).
I'm not sure if i understand you corrently, but calling a Class method in Template would go like this:
{{ MyConroller->doSomething() }}
Of cause you could call one controller within another too... just use raw php
$obj = new MyController();
$obj->foo();
or use the F3 call method $f3->call('MyController->doSomething');
Also check out the new API docs.
http://fatfreeframework.com/base#call
It's still under construction, but hopefully you'll find more information about this or any other framework part very soon.
Many MVC purists would balk at the idea of a View (template) calling methods on the Controller. They would say that the controller needs to provide the data that the view needs, or at least give it the Model, so that it can retrieve data from there.
Furthermore, the View probably shouldn't be doing anything (or asking another component to do anything), other than generating the display. But can query the Model for data. But maybe by doSomething() you do mean getSomeData().
While I'm not an MVC purist I do agree with the idea of keeping logic and functionality out of the view if at all possible.