CAS AngularJS Authentication Filter

I am looking to implement a CAS server for SSO for my angularJS front-end app and Back Backend app. I have configured CAS 4.0 web app and management web app and they are working correctly. The part I'm confused with is how Angularjs and the UI router are supposed to interact with the CAS authentication filter ?? I am using the CAS login page for authentication and cannot figure out how this would work. I have searched for any documentation on this and could not find a solution.

Can anyone point out any direction?

EDIT

Add more details as requested.

Angularjs app has 2 pages.

Landing Page ---> Toolbar Page

In the app config I have configured the security config provided by https://objectpartners.com/2014/05/20/configuring-spring-security-cas-providers-with-java-config/

 @Override
protected void configure(HttpSecurity http) throws Exception {
    http.addFilter(casAuthenticationFilter()).authorizeRequests()
            .antMatchers("/landing").permitAll().antMatchers("/dashboard")
            .authenticated().antMatchers("/dashboard/*").authenticated();
    http.exceptionHandling().authenticationEntryPoint(
            casAuthenticationEntryPoint());
}

@Override
protected void configure(AuthenticationManagerBuilder auth)
        throws Exception {
    auth.authenticationProvider(casAuthenticationProvider());
}

      

        
        
        
      

    

MY cas url - https: //.../cas/login .

Added my casino management app - https: // host: 8443 / myapp / # / dashboard / . * Now my process should be

User ---> Boarding ----> CAS Login -----> Personal Account

I'm not sure what else needs to be configured in terms of Angularjs for the filter to catch the URL change and redirect to the CAS.