Custom Widget Help

I am very new to Angular and I cant seem to make my custom widget work with Lforms. (http://lhncbc.github.io/lforms/index.html)

I have gone though the documentation many times on both sites but I am missing something. Can anyone provide some help or direction on how to make Lforms widget work inside a Bonitasoft Custom Widget?

I have added the below as external resources to the widget and declared the module lformsWidget as required angular modules.

https://clinicaltables.nlm.nih.gov/lforms-versions/13.6.0/styles/lforms.min.css
https://clinicaltables.nlm.nih.gov/lforms-versions/13.6.0/lforms.min.js

In the template section I have the below.

 <div>
    <lforms lf-data="myFormDefinition"></lforms>
  </div>

And in the controller I have:

function ($scope) {
    var myFormDefinition={
    code:"X-001",
    name:"Demoform",
    items:[{
    "questionCode":"X-002",
    "question":"Eyecolor"
    }],
    templateOptions:{viewMode:'lg'}
    };
    
    $scope.lfData = new LForms.LFormsData(myFormDefinition);
}