Jade Mixins in AngularJS

Question

Hi I would like to implement Jade templates in my AngularJS project, and have mixin in my template (reusable code).

However the problem that I am facing is that we cannot use Mixin with arguments. Am I doing it correctly or is there any alternative for the same in AngularJS that I am missing?

Answer 1

I figured out that mixins cannot be used in Angular as the scope is to be defined. Hence now created element directive and passed in the template (which was meant to be written in Mixin) as the templateUrl in it.

Answer 2

You can create an js object from your model and pass it as strings to the mixin like the following:

+avatarRow({name: '{{avatar.name}}', uuid: '{{avatar.uuid}}', verificationCode: '{{avatar.verificationCode}}', status: '{{avatar.status}}'})

Inside the mixin you can now access e.g. #{avatar.uuid}

I considder to automate this further, because this leads to a duplication of the models code which is not so nice yet. I will share my solution if I get one :)